JS： for...in和for...of的区别（四颗星）

1.for in

ES3中的for...in 语句以任意顺序迭代一个对象的除Symbol以外的可枚举属性，包括继承的可枚举属性。

for ... in是为遍历对象属性而构建的，不建议与数组一起使用，数组可以用Array.prototype.forEach()和for ... of，那么for ... in的到底有什么用呢？

它最常用的地方应该是用于调试，可以更方便的去检查对象属性（通过输出到控制台或其他方式）。尽管对于处理存储数据，数组更实用些，但是你在处理有key-value数据（比如属性用作“键”），需要检查其中的任何键是否为某值的情况时，还是推荐用for ... in。

2.for of

for…of 是ES6新增的遍历方式，允许遍历一个含有iterator接口的数据结构（数组、对象等）并且返回各项的值，

for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象，DOM集合，生成器等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句

对于for...of的循环，可以由 break, throw 或 return 终止。在这些情况下，迭代器关闭。

for-of循环不支持普通对象，但如果你想迭代一个对象的属性，你可以用for-in循环（这也是它的本职工作）或内建的Object.keys()方法或Object.values.