for...of .for 不可迭代（在数组上？？？）

Question

let collection = [{
    name: 'music',
    views: 20
  },
  {
    name: 'abc',
    views: 32
  },
  {

    name: 'bob',
    views: 20
  }
]

for (const [k, v] of collection) {
  console.log(k, v)
}

console.log(Array.isArray(collection))

Error: .for is not iterable

Array.isArray(collection)返回真

数组怎么可能不可迭代呢？

我真的需要诉诸于此来“获取”每个项目的索引吗？

for (let i = 0; i < collection.length; i++){
    console.log(i, collection[i])
        
}

nvm ...它与 forEach 配合得很好

collection.forEach((k, v) => {
    console.log(k,v)
})

这里……发生什么事了？

注意：我不能使用 for...in b/ci 需要保证订单

Answer 1

for..of仅迭代值，而不迭代键和值。
用于Array::entries()迭代数组索引和值。
另一方面，如果您只需要数组项中的属性，则可以使用对象解构：

let collection = [
    {
    name: 'music',
    views: 20
    },
    {
    name: 'abc',
    views: 32
    },
    {

    name: 'bob',
    views: 20
    }   
]

// probably what you wanted
for (const [k, v] of collection.entries()){
    console.log(k, v)
}

// if you need items' properties
for (const {name, views} of collection){
    console.log(name, views)
}

更新请
注意，使用类似的迭代器Array::entries()是迭代大数组最慢的方法（手工制作的生成器函数给出完全相同的结果）。在我的 Chrome 基准测试中，有 10000000 个项目数组，速度慢了 1.5-2 倍Array::forEach()（for..of它们实际上在实现中是相同的），并且比旧版本慢至少 6 倍

for(let i = 0; i < arr.length; i++)

这仍然是迭代数组的最快方法。