收费下载网站源码,潍坊网站模板在哪,用户体验设计要素,可以免费建手机网站for...in 和for ...of的区别#xff1f; 1. 前言2. for...in3. for...of4#xff0c;区别5. 总结#xff1a; 1. 前言
for...in和for...of都是JavaScript中遍历数据的方法#xff0c;让我们来了解一下他们的区别。
2. for…in for…in是为遍历对象属性而构建的#xff0… for...in 和for ...of的区别 1. 前言2. for...in3. for...of4区别5. 总结 1. 前言
for...in和for...of都是JavaScript中遍历数据的方法让我们来了解一下他们的区别。
2. for…in for…in是为遍历对象属性而构建的它以任意顺序遍历一个对象的除Symbol以外的可枚举属性可用break或者throw跳出 语法
for (variable in object) {// 在此执行代码
}eg
let obj {name: 张三,age: 18
}for(let item in obj) {console.log(item)
}
// 输出 name age在JavaScript中数组也是对象的一种所以数组也是可以使用for…in遍历 let arr [a, b, c]for(let item in arr) {console.log(item)
}
// 输出 0 1 23. for…of
for...of 语句在可迭代对象上创建一个迭代循环调用自定义迭代钩子并为每个不同属性的值执行语句包括ArrayMapSetStringTypedArrayarguments等等不包括Object可用break或者throw跳出。
语法
for (variable of 可迭代对象) {// 操作语句
}eg:
let arr [a, b, c]let obj {name: 张三,age: 18,sex: 男
}for (let i of arr) {console.log(i)
}
// 输出 a b cfor (let i of obj) {console.log(i)
}
// 报错 obj is not iterable (obj不是可迭代的)4区别
无论是for…in还是for…of都是迭代一些东西。它们之间的主要区别在于它们的迭代方式
for…in语句以任意顺序迭代对象的可枚举属性for…of语句遍历可迭代对象定义要迭代的数据
下面列出遍历Array时候for…in和for…of的区别
let arr [a, b, c]Array.prototype.ufo 张三for(let item in arr) {console.log(item)
}
// 输出 0 1 2 ufofor(let item of arr) {console.log(item)
}
// 输出 a b c上例通过Array.prototype添加了ufo属性由于继承和原型链所以arr也继承了ufo属性属于可枚举属性所以for…in会遍历出来而for…of则不会
5. 总结 使用 for…in 迭代对象的属性名适用于对象。使用 for…of 迭代集合的值适用于数组、字符串等可迭代对象。在迭代数组时通常使用 for…of 而不是 for…in因为 for…in 可能会迭代到数组的原型链上的属性而for…of 不会。在迭代对象属性时可以使用 hasOwnProperty 方法来检查属性是否是对象自身的属性以避免迭代到继承的属性。
