对数组的遍历大家最常用的就是for循环,ES5的话也可以使用forEach,ES5具有遍历数组功能的还有map、filter、some、every、reduce、reduceRight等,只不过他们的返回结果不一样。但是使用foreach遍历数组的话,使用break不能中断循环,使用return也不能返回到外层函数。
那么接下来我们一起看一下for in 和for of 的区别吧。
for in
看一个简单的例子
//for in 应用于数组 Array.prototype.sayHello = function(){ console.log("Hello") } Array.prototype.str = 'world'; var myArray = [1,2,10,30,100]; myArray.name='数组'; for(let index in myArray){ console.log(index); } //输出结果如下 0,1,2,3,4,name,str,sayHello //for in 应用于对象中 Object.prototype.sayHello = function(){ console.log('Hello'); } Obeject.prototype.str = 'World'; var myObject = {name:'zhangsan',age:100}; for(let index in myObject){ console.log(index); } //输出结果 name,age,str,sayHello //首先输出的是对象的属性名,再是对象原型中的属性和方法, //如果不想让其输出原型中的属性和方法,可以使用hasOwnProperty方法进行过滤 for(let index in myObject){ if(myObject.hasOwnProperty(index)){ console.log(index) } } //输出结果为 name,age //你也可以用Object.keys()方法获取所有的自身可枚举属性组成的数组。 Object.keys(myObject)
可以看出for in 应用于数组循环返回的是数组的下标和数组的属性和原型上的方法和属性,而for in应用于对象循环返回的是对象的属性名和原型中的方法和属性。
使用for in 也可以遍历数组,但是会存在以下问题:
1.index索引为字符串型数字,不能直接进行几何运算
2.遍历顺序有可能不是按照实际数组的内部顺序
3.使用for in会遍历数组所有的可枚举属性,包括原型。例如上栗的原型方法method和name属性
Object.prototype.sayHello = function(){ console.log('Hello'); } var myObject = { name:'zhangsan', age:10 } for(let key of myObject){ consoloe.log(key); } //输出结果 //typeError Array.prototype.sayHello = function(){ console.log("Hello"); } var myArray = [1,200,3,400,100]; for(let key of myArray){ console.log(key); } //输出结果 1,200,3,400,100
for in遍历的是数组的索引(即键名),而for of遍历的是数组元素值。 所以for in更适合遍历对象,不要使用for in遍历数组。JavaScript for in 和 for of 的区别
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
暂无“通过实例解析JavaScript for in及for of区别”评论...
更新动态
2024年05月08日
2024年05月08日
- 原神:技术又升级啦?新增角色动作与神态,期待全方面普及
- 林俊杰.2020-幸存者(EP)【华纳】【WAV+CUE】
- 方志耀.1992-给我一点你的爱【飞碟】【WAV+CUE】
- 华晨宇.2015-异类【天娱传媒】【WAV+CUE】
- 月爱解说 王者荣耀一套带走爆发小狐狸妲己攻略
- 吴宇深《时光》[320K/MP3][61.94MB]
- 吴宇深《时光》[FLAC/分轨][86.52MB]
- 张宇《好男人的情歌 精选16首最爱发烧情歌》[WAV+CUE][600MB]
- 原神虹色大巡回第一关攻略 音符补缺打法位置分享
- 王者荣耀五五朋友星活动玩法介绍 规则一览
- 少年西游记2今日全平台公测 真国潮真轻松真福利
- 崩坏星穹铁道2.2光锥怎么抽 崩铁2.2光锥抽取建议
- 崩坏星穹铁道2.2无边曼舞光锥怎么样 崩铁新四星光锥无边曼舞强度
- 崩坏星穹铁道2.2夜色流光溢彩强度介绍 夜色流光溢彩光锥介绍
- 苹果安装双系统好不好,苹果装双系统好用吗