在 for/in 语句中执行对象数组元素的方法时出错。 p5.js

Question

我是韩国人，所以我英语不好。

我制作了 p5.js 贪吃蛇游戏，但 'Food' 对象无法正常工作。我调试了我的代码，所以我只写了代码中出现问题的部分。

var foodArray;
var scl = 20;

function setup(){
  createCanvas(300, 300);
 
  foodArray = [];
  
  foodArray.push(new Food());
  foodArray.push(new Food());
  foodArray.push(new Food());
  
  frameRate(10);
}

function draw() {
  background(0);

  for(var food in foodArray){
    food.show(); // <- ERROR!!
    alert("for executing"); // <- NOT Executed
  }

  foodArray[1].show(); // <- this line executed well.
}

function Food() {
  this.location = createVector(parseInt(random(30)), parseInt(random(30)));

  this.show = function(){
    fill(242,242,242);
    rect(this.location.x*scl, this.location.y*scl, scl, scl);
  }
}

我想知道如何在p5.js中使用for/in语句，谢谢。

Answer 1

您需要使用 for...of 而不是 for...in。区别在于 for...in 遍历列表的键（索引），而 for...of 遍历值。

例如，考虑以下代码：

function setup() {
  let lis = ["a", "b", "c", "d", "e"];
  print("for...in");
  for (let k in lis) {
    print(k);
  }
  print("for...of");
  for (let k of lis) {
    print(k);
  }
}

for...in 版本打印列表的索引，而 for...of 版本打印值（字母）。所以当计算机看到 food.show() 时，变量 food 只是一个数字。由于没有用于数字的方法 .show()，因此会出现错误。

在 for/in 语句中执行对象数组元素的方法时出错。 p5.js

Error when executing method of element of object array in for/in statement. p5.js

p5.js