JavaScript二维数组在for循环push后长度始终为0的问题排查

这种情况我太懂了！看着别人的类似代码正常运行，自己的数组不管怎么push长度都显示0，简直挠头。我帮你梳理几个最可能的原因，你对照着排查下：

1. 不小心在循环内重置了数组 #

最容易犯的低级错误——你可能在for循环里又重新声明了一遍mapList，直接覆盖了外部的数组变量！比如：

let mapList = [];
for (let i = 0; i < devices.length; i++) {
  // 这里多写了一行，直接把外部的mapList覆盖成新数组了！
  let mapList = [];
  mapList.push([devices[i].id, devices[i].name]);
}
console.log(mapList.length); // 0，因为外部的数组根本没被操作过

解决办法：删掉循环内部的let mapList = []，确保全程操作的是同一个数组。

2. 循环里藏着异步操作，你提前读了长度 #

如果你的for循环里有异步代码（比如API请求、setTimeout），push是在异步回调里执行的，但你在循环结束后立刻去拿数组长度——这时候异步任务还没跑完，数组自然是空的！比如：

let mapList = [];
for (let i = 0; i < devices.length; i++) {
  // 模拟异步获取设备数据
  fetch(`/api/get-device/${i}`)
    .then(res => res.json())
    .then(device => {
      mapList.push([device.id, device.name]);
    });
}
// 这里立刻打印，异步回调还没执行，所以长度是0
console.log(mapList.length);

解决办法：用async/await把异步操作改成同步执行，或者等所有异步任务完成后再读取长度：

// 用async/await的正确写法
async function processDevices() {
  let mapList = [];
  for (let i = 0; i < devices.length; i++) {
    const res = await fetch(`/api/get-device/${i}`);
    const device = await res.json();
    mapList.push([device.id, device.name]);
  }
  console.log(mapList.length); // 这里就能拿到正确长度了
}
processDevices();

3. 你不是在push元素，而是直接替换了整个数组 #

有时候手滑写错了代码，把push写成了直接赋值，相当于每次循环都把数组换成新的单个元素，最后要么是单个元素的长度，要么如果没循环到就是0：

let mapList = [];
for (let i = 0; i < devices.length; i++) {
  // 这里是直接替换数组，不是添加元素！
  mapList = [devices[i].id, devices[i].name];
}
console.log(mapList.length); // 如果devices为空就是0，否则是2

解决办法：确保用mapList.push([devices[i].id, devices[i].name])来添加二维数组的元素，而不是直接给mapList赋值。

4. 变量作用域冲突，操作的不是同一个数组 #

如果你的代码里其他地方不小心重复声明了mapList，比如在某个函数内部又声明了一次，那你在循环里操作的其实是局部变量，外部的数组根本没被修改：

let mapList = [];

function handleDevices() {
  // 这里又声明了一个局部的mapList，和外部的不是同一个！
  let mapList = [];
  for (let i = 0; i < devices.length; i++) {
    mapList.push([devices[i].id, devices[i].name]);
  }
}
handleDevices();
console.log(mapList.length); // 0，因为外部数组没被碰过

解决办法：全局搜索代码里的mapList声明，确保只在需要的地方声明一次，全程操作同一个数组引用。

先从这几个方向排查，尤其是异步操作和作用域的问题，这俩是最容易踩的坑！

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