关于JS数组遍历方法的总结

来源：动视网责编：小采时间：2020-11-27 19:52:44

关于JS数组遍历方法的总结

关于JS数组遍历方法的总结:JS的数组遍历是项目中必须用到的，为了写出优雅的代码，将方法用在对的地方，在这里将几种方法做个对比，这里用es6的方式展示出来，需要搭建转换es5环境，这不是这篇的重点，下一篇可以写这个。一、for循环使用频率最高，前端都会用，表示自己一开始只会用f

推荐度：

点击下载本文 文档为doc格式

导读关于JS数组遍历方法的总结:JS的数组遍历是项目中必须用到的，为了写出优雅的代码，将方法用在对的地方，在这里将几种方法做个对比，这里用es6的方式展示出来，需要搭建转换es5环境，这不是这篇的重点，下一篇可以写这个。一、for循环使用频率最高，前端都会用，表示自己一开始只会用f

JS的数组遍历是项目中必须用到的，为了写出优雅的代码，将方法用在对的地方，在这里将几种方法做个对比，这里用es6的方式展示出来，需要搭建转换es5环境，这不是这篇的重点，下一篇可以写这个。

一、for循环

使用频率最高，前端都会用，表示自己一开始只会用for循环。。

let arr = ['123', '456', '7'];for (let i = 0; i < arr.length; i ++) {
 console.log(arr[i]);
}

最常用，但是有优化空间：

for (let i = 0, len = arr.length; i < len; i ++) {
 console.log(arr[i]);
}

使用临时变量，将length值存起来，避免重复获取数组长度。

二、for…of循环

es6新增的循环方式，比es5的for循环更简单且高效，它还提供三个新方法：

key()是对键名的遍历；
value()是对键值的遍历；
entries()是对键值对的遍历；

let arr = ['科大讯飞', 'BG', '前端开发'];
for (let item of arr) { 
 console.log(item);
}
//

输出数组索引 for (let item of arr.keys()) { console.log(item); } // 输出内容和索引 for (let [item, val] of arr.entries()) { console.log(item + ':' + val); }

三、foreach循环

数组的foreach方法使用频率较高，但性能比for循环还弱。它有个优点，可以自动省略为空的数组元素，相当于自动筛空。

let arr = ['科大讯飞', , 'BG', , '前端开发'];
arr.forEach((val,index)=>console.log(index,val));

四、filter循环

有循环的功能，主要用于过滤数组，接收一个方法，它会返回符合函数的元素集合。

let arr = [{
 label: '科大讯飞', 
 value: 1
}, {
 label: 'BG', value: 2
}, {
 label: '前端开发', value: 3
}];

const arr1 = arr.filter(list => list.value === 1);
console.log(arr1);

五、some循环

和filter功能相同，不同的是，它返回boolean值，用于检查数组中是否存在某对象。

if (arr.some(list => list.value === 1)) {
 console.log('执行了！')
}

所以它常用在if里。

六、map循环

替换的作用，它会返回一个由原数组中每个元素调用回调函数后返回值的集合。

let arr = [1, 2, 3, 4];
onst arr1 = arr.map(list => list * 2);
console.log(arr1);

关于JS数组遍历方法的总结

推荐度：

点击下载本文 文档为doc格式

标签：方法 js 方式

热门焦点

关于JS数组遍历方法的总结

关于JS数组遍历方法的总结

一、for循环

二、for…of循环

三、foreach循环

四、filter循环

五、some循环

六、map循环

关于JS数组遍历方法的总结

最新推荐

猜你喜欢

热门推荐