JavaScript之数组五大迭代方法总结

Posted 2020-10-14

ES5定义了五个迭代方法，每个方法都接收两个参数：要在每一项上运行的函数和运行该函数的作用域对象（可选的），作用域对象将影响this的值。传入这些方法中的函数会接收三个参数：数组的项的值、该项在数组中的位置和数组对象本身。

1. every() 和 some()
   

   every()是对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true。

   some()是对数组中的每一项运行给定函数，如果该函数对任一项返回true，则返回true。

   every()和some()很相似，他们都用于查询数组中的项是否满足某个条件，对every()来说，传入的函数必须对每一项都返回true，这个方法才返回true；否则，则返回false。而some()方法则只要传入的函数对数组中的某一项返回true，就会返回true。例如：

   var numbers=[1,2,3,4,5,4,3,2,1];
   
     var everyResult=numbers.every(function(item,index,array){
   
   return (item>2);
   
   });
   
   alert(everyResult);//false
   
   var someResult=numbers.some(function(item,index,array){
   
   return (item>2);
   
   });
   
   alert(someResult);//true

   以上代码调用了every()和some(),传入的函数只要给定项大于2就会返回true。对于every()，它返回的是false，因为只有部分数组符合条件 ; 而对于some()，结果就是true，因为至少有一项是大于2的。

2. filter()
   filter()是对数组中的每一项运行给定函数，返回该函数会返回true的项所组成的数组。它利用指定的函数确定是否在返回的数组中包含某一项。例如：
   

   var numbers=[1,2,3,4,5,4,3,2,1];
   
   var filterResult=numbers.filter(function(item,index,array){
   
   return (item>2);
   
   });
   
   alter(filterResult); //[3,4,5,4,3];

   此例子中，传入的函数要返回一个所有数值都大于2的数组，通过调用filter()方法创建并返回了包含3/4/5/4/3的数组，因为传入的函数对它们的每一项都返回true。这个方法对查询符合某些条件的所有数组项非常有用。

3. map()
   map()是对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。这个数组的每一项都是在原始数据中的对应项上运行传入函数的结果，例如：
   

   var numbers=[1,2,3,4,5,4,3,2,1];
   
     var mapResult=numbers.map(function(item,index,array){
   
   return item*2;
   
   });
   
   alert(mapResult); //[2,4,6,8,10,8,6,4,2]

   以上代码返回的数组中包含每个数乘以2之后的结果，这个方法适合创建包含的项与另一个数组一一对应的数组。

4. forEach()
   forEach() 是多数组中的每一项运行给定函数，这个方法没有返回值。它只是对数组中的每一项运行传入的函数，没有返回值。本质上与使用for循环迭代数组一样。
   

   var numbers=[1,2,3,4,5,4,3,2,1];
   
   numbers.forEach(function(iterm,index,array){
       
       //执行某些操作
   
   });

5. 总结：
   这些数组方法通过执行不同的操作可以大大方便处理数组的任务，支持这些迭代方法的浏览器有IE9+、Firfox2+、Safari3+、Opera9.5、Chrome。