Javascript common higher-order functions details

Higher Order function , called Higher Order function in English. A function that can receive another function as a parameter is called a higher-order function.

Example:

function add(x, y, f) {
 return f(x) + f(y);
}

//Verify with code:
add(-5, 6, Math.abs); // 11

1. Common higher-order functions

ES6 adds several new methods to arrays, among which map , reduce , and filter are all high-order functions. In addition, ordinary sort is also a high-order function. The three new methods are introduced below.

1.1、filter

filter is to filter the array, return the data that meets the conditions, form a new array and return it, and discard the data that does not meet the conditions.

Example 1: Take out the data less than 100 in the array and put it into a new array

let grad = [ 102, 188, 55, 66, 200, 800 ]
let arr2 = grad.filter( function(item){
 return item <= 100
})
console.log("arr2",arr2) // 55, 66

In the above example, the parameter passed to filter is a function. The passed function acts on each element in turn, and then decides whether to keep or discard the element based on whether the return value is true or false . Because only 55 and 66 meet the requirements, there are only these two elements in the new array.

1.2, map

Map means mapping.

The original array is mapped into a new array, and the return value is a new array, without changing the original array. The length of the new array will not change with the original array.

Example 2: Magnify each element of the data by 2 times.

let arr2 = [ 55, 66 ]
let arr3 = arr2.map( item => {
 return item*2
})
//Return result [110, 132]

In the above example, the parameter received by map is a function, which acts on each element in turn, magnifying the element by 2 times, and can also perform arbitrarily complex operations on it.

1.3、reduce

reduce is the process of summarizing arrays. Often an array goes in and a piece of data comes out. Often used for summing and calculating averages.

Example 3: Sum the results returned by the previous example.

let sum = arr3.reduce((tmp,item)=>{
 return tmp+item
})
//Return result 242

Now here comes the point. If we want to combine the above three examples together, how simple can we write it in the end?

Responsible for writing:

// Complex writing let grad = [102,188,55,66,200,800]
let arr2 = grad.filter(function(item){
 return item <= 100
})
let arr3 = arr2.map(item=>{
 return item*2
})
let sum = arr3.reduce((tmp,item)=>{
 return tmp+item
})

Simple writing:

//Simple writing let sum2 = grad
           .filter( item => {return item <= 100})
          .map(item=>{return item*2})
          .reduce((tmp,item)=>{return tmp+item})

This is the end of this article about the details of common higher-order functions Javascript . For more information about common higher-order functions Javascript , please search previous articles on 123WORDPRESS.COM or continue to browse the related articles below. I hope you will support 123WORDPRESS.COM in the future!