警告:很多很多答案都是说for in 遍历了对象的键,for of 遍历了数组的每一项,这种说法太简单粗暴,让我们透过现象看本质!
for in: 遍历了对象本身以及原型链上所有可枚举类型的属性名
- 注意遍历的是属性名,意味着
- for in 遍历数组时,得到的是下标index
- for in 是拿不到属性值的,需要根据属性名手动获取
- 可以遍历原型链上的属性
- 所有属性必须是可枚举属性
for of: 用来遍历可迭代对象,得到的是值
- 只能遍历可迭代对象(数组是,对象不是)
- 一个实现了迭代接口的对象即是可迭代对象。
- JS的默认迭代接口是[Symbol.iterator]
- es6中使用 Symbol.iterator 来获取对象的 @@iterator 属性
- @@iterator 本身并不是一个迭代器对象,而是返回一个迭代器对象的函数
- for of 循环首先会向被访问对象请求一个迭代器对象,然后通过调用迭代器对象的 next 方法来遍历所有返回值
- 注意,得到的是值,不是属性名
- 数组中有内置的 @@iterator,所以默认就是可迭代对象,所以用 for of 迭代数组得到就是数组的各项
- 普通对象中没有内置的 @@iterator 所以默认不能用 for of 遍历
- 但是如果我们自己手动给普通对象增加一个 Symbol.iterator 属性,并且Symbol.iterator 的属性值实现一个next 函数,那么这个普通对象就变成了可迭代对象,那么就可以使用for of 遍历了