JavaScript数组添加元素报错：Uncaught TypeError问题求助

这个错误的核心原因是：你尝试访问一个未初始化的数组元素的子元素。举个例子，假设你的初始数组是这样的：

// 初始3个元素，每个都是含3个子元素的数组
let myArray = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

当你想添加第4个元素时，如果直接写myArray[3][0] = 10，此时myArray[3]是undefined（因为数组只有3个元素，索引到2为止），访问undefined[0]就会触发这个报错。

解决方法 #

添加新元素时，必须先初始化这个元素为数组，再操作它的子元素：

1. 直接推入完整的子数组：

myArray.push([10, 11, 12]);

2. 先初始化空数组，再逐个赋值：

// 先创建第4个元素的空数组
myArray[3] = [];
// 再给子元素赋值
myArray[3][0] = 10;
myArray[3][1] = 11;
myArray[3][2] = 12;

排查步骤 #

检查你添加元素的代码：

• 是不是直接通过索引访问了超出当前数组长度的位置，并且没有先初始化这个位置的数组？
• 如果是循环批量添加，有没有在循环里为每个新元素创建子数组？

内容的提问来源于stack exchange，提问作者Allen Genephat