Javascript Math.pow() 返回未捕获的类型错误 : Cannot read property '0' of undefined

Question

我似乎无法弄清楚为什么会这样:

Populations[0] = Math.round(Math.pow((Populations[0] * Math.E), (popGrowth * 5)));
Populations[1] = Math.round(Math.pow((Populations[1] * Math.E), (popGrowth * 5)));
Populations[2] = Math.round(Math.pow((Populations[2] * Math.E), (popGrowth * 5)));

返回:

未捕获类型错误:无法读取未定义的属性“0”

JSFiddle:http://jsfiddle.net/steventang166/rrsjc79q/72/

window.addEventListener('load', function () {
    document.getElementById("buttonEndTurn").addEventListener('click', endTurn());
});
var Populations = [100, 100, 100];
var popGrowth = [0.1797];
var resourceGold = [1000, 1000, 1000];
var resourceWood = [500, 500, 500];
var minerPercent1 = 0.5;
var minerPercent2 = 0.75;
var minerPercent3 = 0.1;
var Miners = [0, 0, 0];
var Loggers = [0, 0, 0];
var endTurn = function (Populations,popGrowth,resourceGold,resourceWood,minerPercent1,minerPercent2,minerPercent3,Minners,Loggers) {
    popGrowth += Math.random;

    Populations[0] = Math.round(Math.pow((Populations[0] * Math.E), (popGrowth * 5)));
    Populations[1] = Math.round(Math.pow((Populations[1] * Math.E), (popGrowth * 5)));
    Populations[2] = Math.round(Math.pow((Populations[2] * Math.E), (popGrowth * 5)));
        
 for (var m = 0; m < 3;m++) {console.log(Populations[m])};
    
    Miners = [Math.round(Populations[0] * minerPercent1),
    Math.round(Populations[1] * minerPercent2),
    Math.round(Populations[2] * minerPercent3)];

    Loggers = [Populations[0] - Miners[0],
    Populations[1] - Miners[1],
    Populations[2] - Miners[2]];
    for (var i = 0; i < 3; i++) {
        console.log(Miners[i]);
    }
    for (var j = 0; j < 3; j++) {
        console.log(Loggers[j]);
    }

    resourceGold[0] += Miners[0] * 100;
    resourceGold[1] += Miners[1] * 100;
    resourceGold[2] += Miners[2] * 100;

    resourceWood[0] += Loggers[0] * 100;
    resourceWood[1] += Loggers[1] * 100;
    resourceWood[2] += Loggers[2] * 100;

    for (var k = 0; k < 3; k++) {
        console.log(resourceGold[k]);
    }

    for (var l = 0; l < 3; l++) {
        console.log(resourceWood[l]);
    }
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="buttonEndTurn">End Turn</button>
<canvas id="hexCanvas" width="800" height="600" style="width:800px;height:600px" />

Answer 1

Javascript 是 function scoped 。因此，一旦您在函数中声明变量，它就会隐藏全局范围内具有相同名称的变量。

就您而言，您通过将变量 Populations 作为函数 endTurn 的参数来隐藏变量:

var endTurn = function (Populations,popGrowth,resourceGold,resourceWood,minerPercent1,minerPercent2,minerPercent3,Minners,Loggers) {

因此，Populations 在函数内部是未定义，而不是在全局范围内保存应有的值，该值应该是:

var Populations = [100, 100, 100];

要修复错误，只需从 endTurn 函数的参数列表中删除参数 Populations 即可。

此外，您在尝试将函数 endTurn 绑定(bind)到 click 事件时调用它。您可能想写:

document.getElementById("buttonEndTurn").addEventListener('click', endTurn); // <-- without the brackets

<小时/>

工作演示:http://jsfiddle.net/nz3qn1dq/1/

还需要进行一些调整才能使该功能按您的预期工作:

var popGrowth = 0.1797; // <-- Changed from a 1d array to just a number

// ...

popGrowth += Math.random(); // <-- Invoking the Math.random function with brackets.