Js篇-面试题11-比较下for..of与for..in的区别

最新推荐文章于 2022-08-08 17:52:29 发布

原创最新推荐文章于 2022-08-08 17:52:29 发布 · 608 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #js #编程语言 #css #html

本文探讨JavaScript中for..of和for..in循环的区别。for..of主要用于遍历数组的项，而for..in则遍历数组的属性、索引和原型链上的属性。在使用for..in时，可能需要配合hasOwnProperty来过滤原型链上的属性。此外，文章还提及了属性遍历的顺序和可枚举属性的概念。

虽互不曾谋面,但希望能和您成为笔尖下的朋友

以读书,技术,生活为主,偶尔撒点鸡汤

不作,不敷衍,意在真诚吐露,用心分享

点击左上方,可关注本刊

标星公众号（ID：itclanCoder）

如果不知道如何操作

点击这里,标星不迷路

比较下for..of 与 for..in 的区别

请写出如下代码的结果

var arr = ['a', 'b', 'c'];
Array.prototype.hello = 'd';
for(item of arr) {
  console.log(item);
}

for(item in arr) {
  console.log(item);
}

答案: 输出 a,b,c, 0,1,2,hello

共同点: 都会遍历数组的属性

不同点: of 前面的item遍历的是数组arr的项,而in前面的item代表的事数组arr的属性,索引,属性,in 会遍历原型下的属性,不仅仅会遍历自身属性,还会遍历所有继承通过原型链的对象下的属性

for..of:可用于遍历数组,不能遍历对象

因此,如果这不是预期的结果,必须要在循环内使用简单的 if 语句,以便确保我们只访问特定对象的本地属性

访问属性的顺序并不总是他们在循环内部被定义的顺序,另外,定义属性的顺序不一定是访问他们的顺序

使用for..in循环只能遍历可枚举的属性,即在遍历对象时可用的属性,如构造函数属性就不会显示,可以使用propertyIsEnumerable()方法检查哪些属性是可枚举属性

可以使用hasOwnProperty验证对象属性是不是来自原型链

for(var item in arr) {
  //避免来自原型链
  if(arr.hasOwnProperty(item)) {
    console.log(item)
  }
}

玩一玩-搞清亲戚称谓关系

公众号（ID：itclanCoder）

码能让您早脱菜籍，文能让您洗净铅华

可能您还想看更多：

css篇-面试题7-说一说rem与em的区别并如何做移动端适配

Js篇-面试题9-请说一下Js中的事件循环机制

Js篇-面试题8-实现数组的快速,插入,冒泡排序

让自己的网站支持第三方支付能力(支持支付宝与微信支付)

vuepress建站过程中遇到的一些问题