[Front-end knowledge] JavaScript - 5 iterative functions: every, filter, forEach, map, some

[Front-end knowledge] JavaScript - 5 iterative functions: every, filter, forEach, map, some

ECMAScript defines five iteration methods for arrays. Each method receives two parameters: the function to run on each item, and an optional scope object (which affects the value of this in the function) as the context in which the function runs. The function passed to each method receives 3 parameters: the array element, the element index, and the array itself. Depending on the specific method, the execution result of this function may or may not affect the return value of the method. The 5 iteration methods of the array are as follows.

function	describe
every()	Runs the passed function on each item of the array, and returns true if the function returns true for each item.
filter()	Run the incoming function on each item of the array, and the items whose function returns true will form an array and return.
forEach()	Runs the passed function on each item in the array, returning no value.
map()	Runs the passed function on each item in the array, returning an array consisting of the results of each function call.
some()	Runs the passed function on each item in the array, and returns true if one of the functions returns true.

1. [Difference 1] every() and some()

   For every(), the function passed in must return true for each item before it returns true; otherwise, it returns false. For some(), as long as there is an item that makes the passed function return true, it will return 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. [Difference 2] filter()

   every() and some() return true/false, while filter() returns an array, which decides whether an item should be included in the array it returns.

   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. [Difference 3] map()

   filter() returns the sub-terms of the symbolic condition, while map() runs the passed function on the elements at the same position in the original array and returns the result for all elements.

   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. [Difference 4] forEach()

   Unlike the above four iterative methods, forEach() will only run the passed function for each item without returning a value.

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