js中的for-in与for-of

1.for-in

let a = [1, 2, 3];
let ao = {a:'com', b:'org', c:'top'};
let as = 'six';
for (const key in a) {
    console.log(a[key]);
}
//1
//2
//3
for (const key in ao) {
    console.log(ao[key]);
}
//com
//org
//top
for (const key in as) {
    console.log(as[key]);
}
//s
//i
//x

• 数组糟糕的选择
• key为string类型，可能会意外导致如：'2' + 1 == '21'
• 在某些情况下，这段代码可能按照随机顺序遍历数组元素
• 除了遍历数组元素外，还会遍历自定义属性,如果你的数组中有一个可枚举属性 myArray.name，循环将额外执行一次，遍历到名为“name”的索引，就连数组原型链上的属性都能被访问到
• 简而言之，for-in 是为普通对象设计的，你可以遍历得到字符串类型的键，因此不适用于数组遍历。

2.for-of

let a = [1, 2, 3];
let ao = {a:'com', b:'org', c:'top'};
let as = 'six';
let am = new Map([['a', 1], ['b', 2]]);
let ass = new Set([1, 2, 2, '2', '3']);
for (const item of a) {
    console.log(item);
}
//1
//2
//3
for (const key of Object.keys(ao)) {
    console.log(ao[key]);
}
//com
//org
//top
for (const item of as) {
    console.log(item);
}
//s
//i
//x
for (const [key, item] of am) {
    console.log(key)
    console.log(item)
}
//{o:'233'}
//1
//b
//2
for (const key of ass) {
    console.log(key)
}
//1
//2
//2
//3

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