JavaScript数组使用字符串键时length为0及for-of遍历失效问题咨询

问题原因 #

你混淆了JavaScript中数组元素赋值和对象自定义属性赋值的逻辑，具体底层规则如下：

• JavaScript的Array本质是特殊的Object类型，只有键为可转为非负整数的字符串/数字时，才会被识别为数组元素，触发length属性的更新。你使用"b"、"c"这类非数字字符串作为键赋值，本质是给数组对象添加自定义属性，并不会被计入数组元素，因此a.length返回0。
• for...of遍历数组时，只会迭代数组的索引元素，不会遍历对象层面的自定义属性，因此遍历a时没有任何输出；而JS中没有显式返回值的语句默认返回undefined，符合预期。
• 你赋值的a["b"]是合法的数组对象自定义属性，值为标准数组[1,2,3]，因此单独遍历它的行为是正常的。

正确实现方案 #

如果你的使用场景是存储键值对结构，不要用Array，选择更匹配的类型即可：

1. 使用Map结构（支持直接用for...of遍历）

let a = new Map()
a.set("b", [1,2,3])
a.set("c", [4,5,6])
console.log(a.size) // 2
for (const val of a.values()) {
  console.log(val)
}
// 输出 [1,2,3]、[4,5,6]

2. 使用普通Object结构

let a = {}
a["b"] = [1,2,3]
a["c"] = [4,5,6]
// 遍历需要先取属性值
for (const val of Object.values(a)) {
  console.log(val)
}

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