博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
for in,Object.keys()与for of的区别
阅读量:7032 次
发布时间:2019-06-28

本文共 2130 字,大约阅读时间需要 7 分钟。

for in

  • for in一般用于遍历对象的属性;
  • 作用于数组的for in除了会遍历数组元素外,还会遍历自定义可枚举的属性,以及原型链上可枚举的属性;
  • 作用于数组的for in的遍历结果是数组的索引,且都为字符串型,不能用于运算;
  • 某些情况下,可能按照随机顺序遍历数组元素;
1  Array.prototype.sayLength = function(){ 2    console.log(this.length); 3    } 4  let arr = ['a','b','c','d']; 5  arr.name = '数组'; 6  Object.defineProperties(arr,{ 7        type:{ 8                 value:true, 9                 writable:true,10                 enumerable:true11            }12     });13  for(let i in arr){14      console.log(i);//0,1,2,3,name,type,sayLength15   }

 

 


 

Object.keys()

  • 遍历结果为由对象自身可枚举属性组成的数组,数组中的属性名排列顺序与使用for in循环遍历该对象时返回的顺序一致;
  • 与for in区别在于不能遍历出原型链上的属性;
Array.prototype.sayLength = function(){            console.log(this.length);        }        let arr = ['a','b','c','d'];        arr.name = '数组';        Object.defineProperties(arr,{            type:{                value:true,                writable:true,                enumerable:true            }        }); var keys = Object.keys(arr); console.log(keys);//["0", "1", "2", "3", "name", "type"]

 

 


 

for of

  • ES6中添加的循环语法;
  • for of支持遍历数组、类对象(例如DOM NodeList对象)、字符串、Map对象、Set对象;
  • for of不支持遍历普通对象,可通过与Object.keys()搭配使用遍历;(见示例二)
  • for of遍历后的输出结果为数组元素的值;
  • 搭配实例方法entries(),同时输出数组内容和索引;(见示例三)

示例一:

1 Array.prototype.sayLength = function(){ 2  console.log(this.length); 3} 4  let arr = ['a','b','c','d']; 5  arr.name = '数组'; 6  Object.defineProperties(arr,{ 7  type:{ 8        value:true, 9        writable:true,10        enumerable:true11       }12 });13  for(let i of arr){14      console.log(i);//a,b,c,d15  }

 示例二:

var person={    name:'coco',    age:22,    locate:{        country:'China',        city:'beijing',    }}for(var key of Object.keys(person)){    //使用Object.keys()方法获取对象key的数组    console.log(key+": "+person[key]);//name: coco,age: 22,locate: [object Object]}

示例三:

1 let arr3 = ['a', 'b', 'c'];2         for (let [index, val] of arr3.entries()) {3             console.log(index + ':' + val);//0:a 1:b 2:c4         }

PS:让jquery对象支持for of遍历

// 因为jQuery对象与数组相似// 可以为其添加与数组一致的迭代器方法jQuery.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];

 

 

 

 

 

 

注:本文部分内容来自以下链接内容

 

转载于:https://www.cnblogs.com/nerrol/p/8137065.html

你可能感兴趣的文章
java之jvm学习笔记六(实践写自己的安全管理器)
查看>>
Docker容器查看ip地址
查看>>
在PC端或移动端应用中接入商业QQ
查看>>
将python3.6软件的py文件打包成exe程序
查看>>
DataTable 排序
查看>>
大白话5分钟带你走进人工智能-第二十节逻辑回归和Softmax多分类问题(5)
查看>>
嵌入式系统在工业控制中的应用
查看>>
使用httpclient异步调用WebAPI接口
查看>>
c++ 类的对象与指针
查看>>
SSTI(模板注入)
查看>>
rbac models
查看>>
[2615]传纸条 sdutOJ
查看>>
类图标注的使用范例
查看>>
NumberFormat注解 DateTimeFormat
查看>>
[转载]PV操作简单理解
查看>>
Acm Dima and Lisa的题解
查看>>
深入浅出Tomcat系列
查看>>
从网页提取的关键字
查看>>
位运算符
查看>>
PHP str_replace() 和str_ireplace()函数
查看>>