为什么拼接从数组中删除所有元素？

Question

所以我正在尝试制作这款游戏（我在视频中看到过），但我想以不同的方式制作它，但我被卡住了。我有这个带有射弹的阵列。基本上，每次射弹移出屏幕时，我都想从阵列中删除该射弹。问题是当射弹击中屏幕时所有射弹都被删除了。

代码：

function animate(){

    requestAnimationFrame(animate);
    c.clearRect(0, 0, width, height);
    player.draw();
    
    //shoot on click
    addEventListener('click', function(event){
        mousex = event.clientX;
        mousey = event.clientY;
        let angle = Math.atan2(mousey - player.y, mousex - player.x);
        projectiledx = Math.cos(angle) * 8;
        projectiledy = Math.sin(angle) * 8; 
        projectileArray.push(new Projectile(width/2, height/2, 10, projectiledx, projectiledy, black));

    })
    for(let i = 0; i < projectileArray.length; i++){
        projectileArray[i].update();
        if(projectileArray[i].x + projectileArray[i].radius < 0 || projectileArray[i].x - projectileArray[i].radius >= width){
            projectileArray[i].splice(i, 1);
         }
         if(projectileArray[i].y + projectileArray[i].radius < 0 || projectileArray[i].y - projectileArray[i].radius >= height){
            projectileArray[i].splice(i, 1);
         }
    }
}
animate();

Answer 1

我至少可以看出两个问题：

.splice
前不应该有[i]

您正在使用 for 循环迭代数组，并且在该循环中您想要修改该数组的长度 - 这对我来说是个坏主意.. 最好列出要删除的项目，然后在该循环之后...在另一个循环中删除它们（从最后一个开始），如下所示：

 var removalList = [];
 for(let i = 0; i < projectileArray.length; i++){
     projectileArray[i].update();
     if(
         projectileArray[i].x + projectileArray[i].radius < 0 ||
         projectileArray[i].x - projectileArray[i].radius >= width ||
         projectileArray[i].y + projectileArray[i].radius < 0 ||
         projectileArray[i].y - projectileArray[i].radius >= height
     ){
         removalList.push(i);
      }
 }

 for(let i=removalList.length; i>0; i--){
     projectileArray.splice( removalList[i-1], 1 );
 }

为什么拼接从数组中删除所有元素？

Why is splice removing all the elements from an array?

javascript

arrays

for-loop

splice