for...in和for...of

70 阅读1分钟

for...in和for...of

结论

for...in适合遍历对象 for...of适合遍历数组

能够被for...of...遍历的是可迭代对象,因此数组是可迭代对象,对象不是可迭代对象

常见的可迭代对象:数组、字符串、Map对象、Dom元素

//⭐循环数组 
//for...in...的k是数组的索引, for...of...的k是数组的下标
const arr = [1, 2, 3]
//for...in...
for (let k in arr) {
  console.log(k);     //0,1,2 数组索引
}
//for...of...
for (let k of arr) {
  console.log(k);     //1,2,3 数组元素
}

//⭐循环对象
//for...in...可以遍历对象,for...of...不可遍历对象
const obj = { a: 1, b: 2 }
for (let k in obj) {
  console.log(k);      //a,b 键
  console.log(obj[k]); //1,2 值
}

//⭐循环数组对象
const arr = [{ name: '张三' }, { name: '李四' }]
for (let k in arr) {
  console.log(k) // 0,1 索引
  console.log(arr[k]) //{ name: '张三' } { name: '李四' } 数组元素
}
for (let k of arr) {
  console.log(k) //{ name: '张三' } { name: '李四' } 数组元素
}