是否可以一遍又一遍地调用函数，但不重置其以前的值?

Question

所以我正在创建一个飞扬的鸟游戏(如果你了解这个游戏是什么，它会让你更容易理解我要说的话)，在这个游戏中我有 2 个管道。其中一个管道位于最低 y 值 (600px) 处，另一个管道从 y 值 0 开始。因此，这些管道本质上具有相反的 y 值，但具有相同的 X 值(X 值也会移动，但它们仍然是 X 的相同值)。管道的高度也是随机生成的。问题从这里开始：我想要这段代码是在行进了多个 tubeX 像素之后(时间间隔也可以工作)，我想添加另一组管道并对该值执行相同的操作。但是旧管道的值必须保持不变。我认为某种数组是最好的，但我的 javascript 编码能力非常低，直到我看到它才知道如何在我的代码中实现这样的东西。

这段代码生成随机高度：

function pipeY()    {
var top = Math.random() * -32 + 1;
height1 = top * 10;
var bottom = Math.random() * 32 + 1;
height2 = bottom *10 
loop();
}

这将为管道创建一个移动的 X 值：

tubeX = 400;
velocityX = 0;
force = -0.5;
function pipeX()    {  
velocityX += force;
velocityX *= 0.9;
tubeX += velocityX;
}

这将创建彼此相反的两个管道：

function show()  {
var tubeHeight1 = 600;
var tubeHeight2 = 0;
ctx.fillStyle="green";
tube1 = ctx.fillRect(tubeX,tubeHeight1,5,height1);
tube2 = ctx.fillRect(tubeX,tubeHeight2,5,height2);
ctx.stroke();
}

Answer 1

我最终做的是在pipeX()函数中创建了一个while循环。我还将 tubeX 的值更改为 800，因此它只是在 400 像素处更有效地创建一个新管道。这可能不是最有效的方法，但它看起来不错！

function pipeX() {
var lastTime = 0;
velocityX += force;
velocityX *= 0.9;
tubeX += velocityX;
while (tubeX < -25) {
show();
if (tubeX = 400)    {
new pipeY();
new show();
}
}
}