数组的五个迭代方法
前言
ECMAScript 为数组定义了 5 个迭代方法:
每个方法都会接收两个参数:运行的函数以及作为函数运行上下文的作用域对象。其中运行的函数接收 3 个参数:数组元素、元素索引和数组本身。这些方法都不改变调用它们的数组。
对比区别
在这些方法中, every() 和 some() 是最相似的,都是从数组中搜索符合某个条件的元素。虽相似但还是有区别的,如下
<script> let arr = [4,5,1,7,6,8,66,9,88]; let everyResult = arr.every((item,index,array) => item > 7); let someResult = arr.some((item,index,array) => item > 7);
console.log(everyResult);//false console.log(someResult) //true </script>
- 对于 every(),数组里的每一项都必须满足函数才会返回 true,否则返回 false.
- 对于 some(),数组里只要一项传入函数并满足函数就会返回 true.
接下来我们再来看看 filter() ,这个方法基于给定的函数来决定某一项是否应该包含在它返回的数组中。比如,要返回所有数值都大于 2 的数组,如下:
<script> let arr = [4,5,1,7,6,8,66,9,88]; let filterResult = arr.filter((item,index,array) => item > 7); console.log(filterResult);//[8,66,9,88] </script>
这个方法比较适合从数组中筛选满足给定条件的元素。
我们再来看看 map() ,这个方法也会返回一个数组。但是它返回的数组是对原始数组中同样位置的元素运行传入函数而返回的结果,如下:
<script> let arr = [4,5,1,7,66,88]; let mapResult1 = arr.map((item,index,array) => item > 7); let mapResult2 = arr.map((item,index,array) => item * 2); console.log(mapResult1);//[false,false,false,false,true,true] console.log(mapResult2);//[8,10,2,14,132,176] </script>
这个方法非常适合创建一个与原始数组元素一一对应的新数组。
最后,我们来看一下 forEach() ,这个方法只会对每一项运行传入的函数,没有返回值。本质上,就相当于使用 for 循环遍历数组,如下:
<script> let arr = [4,5,1,7,66,88]; arr.forEach((item,index,array) => { //执行某些操作 }); </script>
好了,数组的五个迭代方法介绍完毕(*^▽^*)