js数组循环的几种方式总结

1.for循环
最基本的循环方式,不多说。这种最基本的循环才是速度最快的,效率最高的。
基本代码:for(var i = 0;i<5;i++){
console.log(i)
}
2.for in循环
用来遍历对象的。要知道JavaScript对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。(注意:遍历时不仅能读取对象自身上面的成员属性,也能遍历出对象的原型属性)
基本代码: let obj = {a:1, b:2, c:3};
for (let prop in obj) { //prop指对象的属性名
console.log(prop, obj[prop]);
}
输出:
a,1
b,2
c,3
3.for of循环
作为ES6新增的循环方法,这个方法避开了for-in循环的所有缺陷。而且,它可以正确响应break、continue和return语句。
for-of循环不仅支持数组,还支持大多数类数组对象,例如DOM NodeList对象。但是for of也有一个致命伤,就像例子看到的,没有索引。对,这是优点也是缺点。遍历数组对象,直接就是item.属性(或者item[属性]),而不用像for循环那样arr[index].属性(arrindex)。但是你有的时候真的就得用到index。不好意思,只能把数组转成Map()。但我觉得真的需要用到index,还是换成forEach吧。

循环数组
基本代码: let arr = [‘123’,‘qwewq’,‘sfds’];
for(let item of arr){
console.log(item); //item指的的就是数组每一项的值。不是索引。
}
//输出
//‘123’
//‘qwewq’
//‘sfds’
4.forEach循环
里面没办法用break跳出循环。而且在IE中无法实现,需要做兼容处理。没有 return 返回值。
基本代码: let arr = [‘123’,‘qwewq’,‘sfds’];
myArray.forEach(function (value, index) {
console.log(value,index);
});
输出结果
“123”,1
“qwewq”,2
“sfds”,3
5.map循环
映射 ,将原有的数组映射成一个新数组,不操作原数组,返回新数组,回调函数中返回什么这一项就是什么
forEach、map都是ECMA5新增数组的方法。map支持return
基本代码: let arr = [‘123’,‘qwewq’,‘sfds’];
arr.map(function(value,index){
console.log(value,index);
});

					输出
					"123",1
					"qwewq",2
					"sfds",3

以上就是常用的几种for循环总结,很多细节,原理之类的没有写。因为这只是一个简单使用的介绍,不想写那么多。此外,还有很多像while循环,do-while循环之类的其它循环方法,都没提。因为根据我的使用经验,上面的几种已经可以应对几乎所有情况了

发布了22 篇原创文章 · 获赞 26 · 访问量 638

猜你喜欢

转载自blog.csdn.net/HwH66998/article/details/103060889