1、for...of
for...of 语句在 可迭代对象（包括 String，Array，Map，Set，TypedArray，arguments 对象等，注意：对象类型 obj 并不属于可迭代对象）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句。MDN 文档
const array = ['a', 'b', 'c']; for (const element of array) { console.log(element); } // expected output: "a" // expected output: "b" // expected output: "c"
注意：for...of 的循环相比 forEach 来说，可以通过 break，throw continue 或 return 将迭代器关闭，而 forEach 循环无法中途跳出，break 命令或 return 命令都不能奏效。
2、for...in
for...in 是为遍历对象 属性而构建的，不建议与数组一起使用，数组可以用 Array.prototype.forEach（）或 for.…of，而 for…in 最常用的是去检查对象属性。MDN 文档
var obj = {a:1, b:2, c:3}; for (var prop in obj) { console.log("obj." + prop + " = " + obj[prop]); } // Output: // "obj.a = 1" // "obj.b = 2" // "obj.c = 3"
3、简单总结
forEach 循环无法中途跳出，break 命令或 return 命令都不能奏效。
for...of 适用遍历 字符串 / 数组 / Map / Set 等，但是不能遍历对象。它可以正确响应 break、continue 和 return 语句。
for...in 适用于遍历 对象，但是它会遍历原型链上的属性，最好结合 hasownProperty() 使用。
用 for...of 迭代对象的时候，直接输出了数组的值，而不输出数组的索引。我们可以用 Object.keys() 方法来迭代一个对象的属性，来获取其索引。
// simple array var arr = ['a', 'b', 'c']; console.log(Object.keys(arr)); // console: ['0', '1', '2'] // array like object var obj = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.keys(obj)); // console: ['0', '1', '2']
