Javascript移位数组问题

Question

我对 JS 很陌生。

正在学习本教程 (https://youtu.be/0ArCFchlTq4)。 在这个项目中发现了一些有趣的东西，这让我很困扰。可能有人可以帮我想出一些答案。

有这部分代码，我们在其中移动管道数组（下面列出的代码）。但是在移动之后，最左边的管道会产生这种奇怪的东西——它会在短时间内保持移动，使管道在视觉上相对于前景向后移动几个像素，例如，它以与管道相同的速度移动。这发生在 shift 命令执行的同一时刻，并且只影响数组中的下一个管道。

如果有人可以向我解释这一点，我会很高兴，也许会给出修复的提示。谢谢！

 // if the pipes go beyond canvas, we delete them from the array
            if(p.x + this.w<= 0){
            
                this.position.shift();
                score.value += 1;
                SCORE_S.play();
                score.best = Math.max(score.value, score.best);
                localStorage.setItem("best", score.best);
            }
        }
    },
    
    reset : function(){
        this.position = [];
    }
    
}

Answer 1

我相信这是由于 .shift() 方法的行为造成的。

正如你在 MDN 上看到的，它改变了调用它的数组的长度。我没有看完整个代码，但是从

if(p.x + this.w<= 0){
        
            this.position.shift();
            score.value += 1;
            SCORE_S.play();
            score.best = Math.max(score.value, score.best);
            localStorage.setItem("best", score.best);
        }
    }
}

我们可以看到位置中的第一个管道，一个数组，正在被删除，当它发生时，其他所有管道都会影响到它在数组中的顺序。除了那个，我看不出它会导致管道上的小结冰的原因。