Js在if中只识别数组的前2个元素

Js recognizes only first 2 elements of an array in if

根据我的老问题,我在 html/js/css 开始从头开始重建我的游戏。当我只有播放器和 1 块积木时,它似乎可以工作,但当有 2 块或更多积木时,它似乎不起作用。

我复制了使用一个数组将对象推入其中的概念。然后,我没有使用过滤器,而是为此数组使用了一个 for-of 循​​环,用于一个函数中的移动,并检查 curentElement(player 0) 是否与 Obj(由循环选择) 不同,然后检查位置和记录它是否撞到什么东西。这是我的代码:

window.addEventListener("keydown",function Keydown(e) {
  if (e.keyCode==37||e.keyCode==65) {
   for (i=0;i<16;i++) {
    if(move(currentElement,[-1,0])){break};
   }
  }
  else if (e.keyCode==38||e.keyCode==87) {
   for (i=0;i<16;i++) {
    if(move(currentElement,[0,1])){break};
   }
  }
  else if (e.keyCode==39||e.keyCode==68) {
   for (i=0;i<16;i++) {
    if(move(currentElement,[1,0])){break};
   }
  }
  else if (e.keyCode==40||e.keyCode==83) {
   for (i=0;i<16;i++) {
    if(move(currentElement,[0,-1])){break};
   }
  }
  return 0;
 }
);

function move(element,direction) {
 let newX=element.x+direction[0];
 let newY=element.y+direction[1];
 for (let Obj of Objects) {
  if (element!==Obj) {
   if (newX>=0&&newY>=0&&(newX+element.width)<=world.width&&(newY+element.height)<=world.height&&(newX>=(Obj.x+Obj.width)||newY>=(Obj.y+Obj.height)||(newX+element.width)<=Obj.x||(newY+element.height)<=Obj.y)) {
    element.x=newX;
    element.y=newY;
    element.setPosition();
    break;
   } else if (newX<=0&&direction[1]==0) {console.log("Off the world to the left")}
   else if (newY<=0&&direction[0]==0) {console.log("Off the world to the bottom")}
   else if ((newX+element.width)>=world.width&&direction[1]==0) {console.log("Off the world to the right")}
   else if ((newY+element.height)>=world.height&&direction[0]==0) {console.log("Off the world to the top")}
   else if (newX<=(Obj.x+Obj.width)) {console.log("Hitting to the right:",Obj)}
   else if (newY<=(Obj.y+Obj.height)) {console.log("Hitting to the top:",Obj)}
   else if ((newX+element.width)>=Obj.x) {console.log("Hitting to the left:",Obj)}
   else if ((newY+element.height)>=Obj.y) {console.log("Hitting to the bottom:",Obj)}
   return 1
  }
 }
 return 0;
}

function CreateObject(element,x,y) {
 const Hitbox={
  "class":element.className,
  "x":x,
  "y":y,
  "width":element.offsetWidth,
  "height":element.offsetHeight,
  "setPosition":function(){element.style.left=this.x+"px";element.style.bottom=this.y+"px";},
 }
 Hitbox.setPosition();
 Objects.push(Hitbox);
 return Hitbox;
}

const world={
 "width":document.getElementById("world").offsetWidth,
 "height":document.getElementById("world").offsetHeight
};

Objects=[];
const player=[
 CreateObject(document.getElementsByClassName("player")[0],0,0)
];
const brick=[
 CreateObject(document.getElementsByClassName("brick")[0],96,0),
 CreateObject(document.getElementsByClassName("brick")[1],128,32)
];
const currentElement=player[0];
#world {
 position:absolute;
 top:0px;
 left:0px;
 background-color:blue;
 width:640px;
 height:320px;
}
.player {
 position:absolute;
 background-color:red;
 width:32px;
 height:32px;
}
.brick {
 position:absolute;
 background-color:yellow;
 width:32px;
 height:32px;
}
<body>
 <div id="world">
  <div class="player"></div>
  <div class="brick"></div>
  <div class="brick"></div>
 </div>
 <script src="./js/physics.js"></script>
</body>

它应该只是阻止我撞到第二块砖(第一块砖阻止我并记录它),但它让我通过并且不记录任何相关信息。它接缝得到正确的 x,y,width,height,setPosition 值,所以我认为这是由于移动函数中的 if 语句,但我不确定。有人能解释一下为什么会这样吗?我在谷歌上搜索了很多,但看起来没有什么是我正在搜索的。 PS:我想留下没有 jQuery 的代码,但如果有必要,我会使用它。

在处理完第一个非currentElement对象后,您returnmove函数中的for循环开始:

function move(element,direction) {
    let newX=element.x+direction[0];
    let newY=element.y+direction[1];
    for (let Obj of Objects) {
        if (element!==Obj) {
            if (newX>=0&&newY>=0&&(newX+element.width)<=world.width&&(newY+element.height)<=world.height&&(newX>=(Obj.x+Obj.width)||newY>=(Obj.y+Obj.height)||(newX+element.width)<=Obj.x||(newY+element.height)<=Obj.y)) {
                element.x=newX;
                element.y=newY;
                element.setPosition();
                break;
            } else if (newX<=0&&direction[1]==0) {console.log("Off the world to the left")}
            else if (newY<=0&&direction[0]==0) {console.log("Off the world to the bottom")}
            else if ((newX+element.width)>=world.width&&direction[1]==0) {console.log("Off the world to the right")}
            else if ((newY+element.height)>=world.height&&direction[0]==0) {console.log("Off the world to the top")}
            else if (newX<=(Obj.x+Obj.width)) {console.log("Hitting to the right:",Obj)}
            else if (newY<=(Obj.y+Obj.height)) {console.log("Hitting to the top:",Obj)}
            else if ((newX+element.width)>=Obj.x) {console.log("Hitting to the left:",Obj)}
            else if ((newY+element.height)>=Obj.y) {console.log("Hitting to the bottom:",Obj)}

            // Probably do NOT want to return here.. but rather just continue through the 
            // rest of the objects in Objects**
            return 1
        }
    }
    return 0;
}