for in / for of

for in / for of都是用来遍历属性的。

//遍历对象的时候
    const obj = {
        a: 1,
        b: 2,
        c: 3
    }
    for (let i in obj) {
        console.log(i)
        // a
        // b
        // c
    }
    for (let i of obj) {
        console.log(i)
        // Uncaught TypeError: obj is not iterable 报错了
    }

//遍历数组的时候
 const arr = ['a', 'b', 'c']
    // for in 循环
    for (let i in arr) {
        console.log(i)
        // 0
        // 1
        // 2
    }
    
    // for of
    for (let i of arr) {
        console.log(i)
        // a
        // b
        // c
    }

for in

• for ... in 循环返回的值是数据结构的 键值名。(主键？)
• 所以在遍历对象的时候，会循环返回对象的key值(主键值)。
• 所以在遍历数组的时候，会返回下标。
• 总结一句: for in 循环特别适合遍历对象。

for of

• for of 循环用来获取一对键值对中的值。
• 一个数据结构只要部署了 Symbol.iterator属性, 就被视为具有 iterator接口, 就可以使用 for of循环。
• 哪些数据结构部署了 Symbol.iteratoer属性了呢?
  • 数组 Array
  • Map
  • Set
  • String
  • arguments对象
  • Nodelist对象, 就是获取的dom列表集合

参考文章

for in 和 for of的区别详解

for in 和for of的区别