【前端知识】JavaScript——5个迭代函数：every、filter、forEach、map、some

【前端知识】JavaScript——5个迭代函数：every、filter、forEach、map、some

ECMAScript 为数组定义了 5 个迭代方法。每个方法接收两个参数：以每一项为参数运行的函数，以及可选的作为函数运行上下文的作用域对象（影响函数中 this 的值）。传给每个方法的函数接收 3个参数：数组元素、元素索引和数组本身。因具体方法而异，这个函数的执行结果可能会也可能不会影响方法的返回值。数组的 5 个迭代方法如下。

函数	描述
every()	对数组每一项都运行传入的函数，如果对每一项函数都返回 true，则这个方法返回 true。
filter()	对数组每一项都运行传入的函数，函数返回 true 的项会组成数组之后返回。
forEach()	对数组每一项都运行传入的函数，没有返回值。
map()	对数组每一项都运行传入的函数，返回由每次函数调用的结果构成的数组。
some()	对数组每一项都运行传入的函数，如果有一项函数返回 true，则这个方法返回 true。

1. 【区别一】every() 和 some()

   对 every() 来说，传入的函数必须对每一项都返回 true，它才会返回 true；否则，它就返回 false。而对 some() 来说，只要有一项让传入的函数返回 true，它就会返回 true。

   let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; 
   let everyResult = numbers.every((item, index, array) => item > 2); 
   console.log(everyResult); // false 
   
   let someResult = numbers.some((item, index, array) => item > 2); 
   console.log(someResult); // true
   

   

2. 【区别二】filter()

   every() 和 some()返回值是true/false，而 filter() 返回的是数组，其决定某一项是否应该包含在它返回的数组中。

   let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; 
   let filterResult = numbers.filter((item, index, array) => item > 2); 
   console.log(filterResult); // 3,4,5,4,3
   

   

3. 【区别三】map()

   filter() 返回符号条件的子项，而 map() 对原始数组中同样位置的元素运行传入函数而返回所有元素的结果。

   let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; 
   let mapResult = numbers.map((item, index, array) => item * 2); 
   console.log(mapResult); // 2,4,6,8,10,8,6,4,2
   

   

4. 【区别四】forEach()

   不同于上面4个迭代方法，forEach() 只会对每一项运行传入的函数，没有返回值。

   let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; 
   numbers.forEach((item, index, array) => {
         
          
    // 执行某些操作 
    console.log(item);
   });