Question

我一直得到错误，无法在create2DArray中设置未定义的属性'0'。

介意解释这里的逻辑有什么问题？我知道这是一个新手的错误，因为我还没有掌握阵列。

const ROW = 10;
const COL = 11;
const SIZE = 64;

var canvas = document.getElementById("canvas");
var surface = canvas.getContext("2d");
const image = new Image();
image.src = "box_image.png";

//creating a tile
function Box() {
    this.xaxis = 0;
    this.yaxis = 0;
    this.img = image;
}

create2DArray();

//creating map
var map = [];

function create2DArray() {
    for (var i=0; i < ROW; i++){
        map[i] = [];
        for (var j=0; j<COL; j++){
            map[i][j] = new Box();
        }
    }
}

Answer 1

你应该知道这里有变量吊装。

您声明map的方式，在create2DArray调用之后声明并初始化。

这里有两个捕获

在函数中的任何地方声明和定义的变量，它们被提升到函数的顶部，带有声明但不是初始化。在您的情况下，只有 var map; 被提升但不是 var map = []
函数总是被提升，无论它们在哪里进行delcared，因此即使方法声明结束，你仍然可以调用。但是当你有一个函数表达式时，你会遇到同样的问题，因为你没有定义createArray，如果你有这样的话。
```
var create2DArray = function() {
   for (var i = 0; i < ROW; i++) {
        map[i] = [];
        for (var j = 0; j < COL; j++) {
          map[i][j] = new Box();
        }
  }
}
```

const ROW = 10;
const COL = 11;
const SIZE = 64;

var canvas = document.getElementById("canvas");
var surface = canvas.getContext("2d");
const image = new Image();
image.src = "box_image.png";

//creating a tile
function Box() {
  this.xaxis = 0;
  this.yaxis = 0;
  this.img = image;
}

var map = [];

create2DArray();

//creating map


function create2DArray() {
  for (var i = 0; i < ROW; i++) {
    console.log("Creating Box", i);
    map[i] = [];
    for (var j = 0; j < COL; j++) {
      
      map[i][j] = new Box();
    }
  }
}

<canvas id="canvas"></canvas>

有关Variable and Function hoisting

无法访问我的阵列

1 个答案: