for...of 笔记

for...of为什么不能遍历Object对象

因为能够被 for...of 正常遍历的，都需要实现一个遍历器 Iterator。而数组、字符串、Set、Map结构，早就内置好了 Iterator（迭代器），它们的原型中都有一个 Symbol.iterator 方法，而 Object 对象并没有实现这个接口，使得它无法被 for...of 遍历。

console.log(Array.prototype[Symbol.iterator])
 
console.log(String.prototype[Symbol.iterator])
 
console.log(Set.prototype[Symbol.iterator])
 
console.log(Map.prototype[Symbol.iterator])
 
console.log(Object.prototype[Symbol.iterator])

image.png

Codepen: https://codepen.io/MonguDykrai/pen/RqdVxv

Object

const obj = {a:1, b:2}

console.log(obj)

for (let k of obj) {
  console.log(k)
}

image.png image.png

Codepen: https://codepen.io/MonguDykrai/pen/wQOdMb

Array

const arr = [1, 2]

console.log(arr)

for (let v of arr) {
  console.log(v)
}

image.png

Codepen: https://codepen.io/MonguDykrai/pen/zMbwKw

for...of 循环结束的条件 next 的返回值包含 done: true

for_of遍历结束的条件done_true1.gif

Codepen: https://codepen.io/MonguDykrai/pen/rQRZQV

参考资料：
http://es6.ruanyifeng.com/#docs/iterator