for in 和 for of的区别和应用场景

for-in 和 for-of 都是JavaScript循环语句

for-in循环用于遍历一个对象或者数组所有可枚举的属性或索引，包括原型链上的属性。它通常用于遍历对象的属性或数组的索引，并执行一下操作。

const obj = {a: 1, b: 2, c: 3}
for (const key in obj) {
  console.log(key + ': ' + obj[key])
}
// 输出：
// a: 1
// b: 2
// c: 3

for-of循环用于遍历可迭代对象（interable）的所有元素，包括 数组、字符串、Set、Map等。它与for-in循环不同的是，for-of循环遍历的是元素本身而不是索引或者属性。例如：

const arr = [1, 2, 3]
for (const item of arr) {
  console.log(item)
}
// 输出：
// 1
// 2
// 3

需要注意的是，for-in循环会遍历原型链上的属性，因此可能会遍历到不希望遍历到的属性。为了避免这种情况，可以使用hasOwnProperty方法来判断一个属性是否是对象自身的属性。而for-of循环只能够用于遍历可迭代对象，如果要遍历一个普通的对象，可以使用Object.keys或者Object.values方法将其转换为数组后再进行遍历。