Javascript 错误；（数组）未定义speelVeld

我需要为学校的一个项目制作一个基于瓷砖的游戏，但遇到了一个我似乎无法解决的“关键”错误

这是我的剧本：

function init(){
var speelVeldBreedte;
var speelVeldHoogte;
var speelVeld = [
    [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1],
    [1,0,1,0,1,0,1,0,0,1,0,1,0,1,0,0,1,0,1,0,1,1,0,1,1,0,1,0,1,1,1,1]
];

var speelTerrein = document.getElementById("speelterrein");
}

speelVeldBreedte=speelVeld[0].length; 
speelVeldHoogte=speelVeld.length;

var schaalTerrein = 20;
speelTerrein.width = speelVeldBreedte * schaalTerrein; 
speelTerrein.height = speelVeldHoogte * schaalTerrein;


var ctx = speelTerrein.getContext("2d");
ctx.fillStyle = "white";
ctx.fillRect(0,0,speelTerrein.width,speelTerrein.height);
    for (var y=0; y<speelVeldHoogte;y++){
        for (var x=0;x<speelVeldBreedte;x++){
            var steen = speelVeld[y][x];
            if (steen> 01){
                ctx.fillStyle = "rgb(100,0,0)";
                ctx.fillRect(x*schaalTerrein,y*schaalTerrein,schaalTerrein,schaalTerrein);
            }
        }
    }

指第32行，即：

speelVeldBreedte=speelVeld[0].length;

我希望有人能告诉我如何解决这个错误，到底是什么问题

提前感谢,， Remy

spelVeld（以及与此相关的所有变量）的作用域在init（）函数中

---

您可以在这里阅读有关作用域的内容：

您已经在

init（）

函数体中定义了

speelVeld

，并且您对第32行的调用在该函数之外——因此，JS无法“看到”变量，因为它超出了作用域。

因此，假设我将所有代码都放在init函数内，然后使用window.load=init；加载它；，它会起作用吗？您至少应该在init（）之外声明变量。。。而且，确实要确保init（）被调用。但是你不会把你的整个游戏放在一个函数里，对吗？当我把代码放在函数外的时候，问题是它告诉我在这行：speelTerrein.width=speelVeldBreedte*schalterrein；我得到了错误：uncaughttypeerror：无法设置null的属性“width”，这意味着您的行

var speelTerrein=document.getElementById（“speelTerrein”）

生成了一个空值——换句话说，没有名为

speelterrein

的页面元素。但是在html5文件中，我用id“speelterrein”创建了一个div，当我键入“document.getElementById（”时，它会自动显示对speelterrein的引用。这就是我被卡住的原因

speelVeldBreedte=speelVeld[0].length;