谁能告诉我为什么这不起作用?据我所知购买文档和我能找到的任何示例,它应该,但我不断收到以下错误
var colorArray = [];
colorArray[0] = [];
colorArray[0][0] = '2F76EE';
colorArray[0][1] = '2F76EE';
colorArray[0][2] = '5fff74';
colorArray[0][3] = '5e6cff';
colorArray[0][4] = 'a6ff1d';
colorArray[1][0] = '2F76EE'; //error is happening here
colorArray[1][1] = '2F76EE';
colorArray[1][2] = '5fff74';
colorArray[1][3] = '5e6cff';
colorArray[1][4] = 'a6ff1d';
运行时报错
Uncaught TypeError: Cannot set property '0' of undefined
谢谢!
最佳答案
当你说 colorArray[1][0]
时,JavaScript 访问 colorArray[1]
并且因为它还没有定义,它的计算结果为 undefined
。因此,您正在尝试执行 undefined[0]
。这就是它失败的原因。
要解决这个问题,
你必须像这样初始化元素 1
colorArray[1] = [];
在对该元素进行任何更改之前
colorArray[1][0] = '2F76EE'; colorArray[1][1] = '2F76EE'; ...
既然你在做静态初始化,你甚至可以做
var colorArray = []; colorArray.push([ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]); colorArray.push([ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]);
否则,你可以像这样直接初始化
var colorArray = [[ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ], [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]];
你也可以这样做
var element1 = [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]; var element2 = [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]; var colorArray = []; colorArray.push(element1, element2);
注意:你可能想知道,为什么我不能简单地做
colorArray.push(element1, element1);
因为两个数组是一样的。当然,它会起作用。但它有一个问题。 如果您改变其中一个数组,它也会影响其他数组。例如,
var element1 = [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d' ]; var colorArray = []; colorArray.push(element1, element1); colorArray[0].push("abcdef"); console.log(colorArray); // [ [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d', 'abcdef' ], // [ '2F76EE', '2F76EE', '5fff74', '5e6cff', 'a6ff1d', 'abcdef' ] ]
您可能没有预料到这一点。但是在 JavaScript 中,所有的变量名都只是对对象的引用。因此,当您执行
colorArray.push(element1, element1);
时,您将添加相同的引用两次。所以,这两个元素都指向同一个对象。因此,改变一个会影响另一个。
关于Javascript 二维数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22495694/