for in for of遍历区别

for循环和for...in循环都是用来遍历数组或对象的元素的，但它们的用法略有不同：

1. for循环：用于遍历数组或对象，可以使用数组下标或对象属性进行访问和操作。

2. for...in循环：用于遍历对象的可枚举属性，包括自身属性和原型链上的属性，不能用于遍历数组。for...in循环返回的是属性名，而不是属性值。

3. for...of循环：用于遍历可迭代对象（例如数组、字符串、Set、Map等），返回的是迭代器对象的值，而不是索引或属性名。

举个例子：

const arr = [1, 2, 3];
const obj = {a: 1, b: 2, c: 3};

// for循环
for(let i=0; i<arr.length; i++) {
  console.log(arr[i]);
}

for(let key in obj) {
  console.log(key, obj[key]);
}

// for...of循环
for(let item of arr) {
  console.log(item);
}

// 错误的使用for...in循环遍历数组
for(let index in arr) {
  console.log(index, arr[index]);
}

输出结果分别为：

1
2
3

a 1
b 2
c 3

1
2
3

0 1
1 2
2 3

可以看到，for循环和for...of循环遍历数组的结果相同，而for...in循环遍历数组的结果是索引值，而不是数组元素本身。因此，在遍历数组时应该使用for循环或for...of循环，而不是for...in循环。