for in和for of

相同点

for in 和for of 都是用来遍历元素的。

区别

1. for in 用来遍历key。可以用在 对象,字符串,数组中使用。
2. for of是ES6引进的新语法，用来遍历value。可以用在 数组，Map，Set，String，arguments对象Nodelist对象等中使用。
3. 普通对象上不能直接使用for of，可以通过Object.Values 配合for of 来达到类似的效果。

拓展-为啥需要for of

要从 iterator接口 说起。

1. js有4种表示“集合”的数据结构： Array，Object，Map，Set。需要一种相对统一的方案来做遍历 ---> 方案： iterator接口 + for of
2. ES6 规定，默认的Iterator接口部署在数据结构的Symbol.iterator属性。或者说，一个数据结构只要具有Symbol.iterator属性，就可以认为是“可遍历的”（iterable），就可以用for...of循环遍历它的成员
3. for...of循环内部调用的是数据结构的Symbol.iterator方法。for...of循环可以使用的范围包括：string, Array、Set、Map、类数组对象（如arguments对象、DOM NodeList 对象）、 Generator 对象。
4. 普通对象不能使用for of，除非自己实现iterator接口