无法遍历object：含array index列表的对象为何触发不了foreach？

嘿，这个问题我踩过好几次坑了！咱们先把根源说清楚，再给你解决办法：

问题本质：foreach只认「可迭代对象」 #

forEach 这个方法是给可迭代对象设计的——比如数组、Map、Set、字符串这些自带迭代器的类型。而普通的JavaScript对象，哪怕你的键是0、1、2这种看起来像数组索引的数字，它本质还是个普通对象，默认没有内置的迭代器机制。所以你直接对它调用forEach，要么会报你看到的"Cannot iterate over object"错误，要么就直接跳过不执行循环。

举个例子，你可能有个这样的对象：

const indexedObj = {
  0: '第一个元素',
  1: '第二个元素',
  2: '第三个元素'
};
// 直接调用indexedObj.forEach(...) 要么报错，要么啥都不做

几种靠谱的解决办法 #

1. 用Object.keys()遍历键，再取值 #

先拿到对象所有的键（会自动转成字符串类型的索引），再遍历键来访问对应的值：

Object.keys(indexedObj).forEach(key => {
  const value = indexedObj[key];
  console.log(`索引${key}对应的值：${value}`);
});

2. 用Object.values()直接遍历值 #

如果不需要用到索引，直接拿所有值来遍历更省事：

Object.values(indexedObj).forEach(value => {
  console.log(`值：${value}`);
});

3. 用Object.entries()同时拿键和值 #

如果需要同时获取索引和对应的值，这个方法最方便：

Object.entries(indexedObj).forEach(([key, value]) => {
  console.log(`索引${key}：${value}`);
});

4. 把对象改成真正的可迭代对象（进阶玩法） #

如果你想让这个对象本身支持forEach（或者for...of循环），可以给它添加一个[Symbol.iterator]方法，让它变成可迭代对象：

const indexedObj = {
  0: '第一个元素',
  1: '第二个元素',
  2: '第三个元素',
  [Symbol.iterator]() {
    const keys = Object.keys(this);
    let index = 0;
    return {
      next: () => {
        if (index < keys.length) {
          return { value: this[keys[index++]], done: false };
        }
        return { done: true };
      }
    };
  }
};

// 现在就能直接用for...of遍历了，也可以转成数组后用forEach
Array.from(indexedObj).forEach(value => {
  console.log(value);
});

内容的提问来源于stack exchange，提问作者Il Ragazzo Di Campagna