Do you know any useful higher-order functions for arrays?
Foreword: Arrays have many methods, all of which are simple and convenient, such as push, pop, etc., but there are many high-order functions used in practice. Now let’s summarize the methods and scenarios. First, what is a high-order function: high-level A function of order is a function in which another function can be passed as an argument.
- forEach
- filter
- map
- sort
- some
- every
- reduce
- find
1.forEach
forEach traverses each data in the array. The difference with for is that for can modify each item of the traversed array, while forEach does not change the original array (if the value of the array object is modified, forEach also modifies the object value)
Simple use - a certain data in the array is used as a judgment basis to modify other data
let arr = [ {
name:1}, {
name:2}, {
name:3},{
name:4}];
let num;
arr.forEach((item,index) => {
if(item.name === 1){
num = 10
}
});
2.filter
filter to filter out the arrays that meet the conditions, satisfying the conditions === Returns each item whose written condition is true to form a new array, and will not change the original array. Simple use - filter out the numbers in the array whose number is greater than 8
let arr = [{
name: 'a', number: 12 },{
name: 'b', number: 8 },{
name: 'c', number: 7 }, {
name: 's', number: 5 }]
let arr1 = arr.filter((item, index) => {
return item.number > 8
})
Note: filter. No matter what your return condition is, it will return an overall element of the array that satisfies the condition, such as
let arr = [ {
name: 'c', id: 1 }, {
name: 'c', id: 3 }, {
name: 'c', id: 8 }]
let arr2 = [1, 5]
let a = arr.filter(item => arr2.includes(item.id))
console.log(a)
At this time, the entire object {name: 'c', id: 1 } that satisfies the condition (the array contains id 1, 5) is returned
3.map
Map traversal, returning each item of the processed array to form a new array (map is generally used when each item of the array is needed), usually used to reassemble the objects of the array, or need to add new items to the array Data, such as using map to traverse in react
Simple example 1 - reassemble the data of an array object
let arr = [{
name: 'a', age: 15, fav: "篮球" },{
name: 'b', age: 15, fav: "足球" },{
name: 'c', age: 15, fav: "乒乓球" }, {
name: 'd', age: 15, fav: "排球" }, {
name: 'e', age: 15, fav: "羽毛球" }];
let arr1 = arr.map((item, index) => {
return {
pepleName: item.name, myFav: item.fav, index: index + 1 }
})
Print arr1 - is the simple instance of the array after data reconstruction 2 - add new data to the array
let arr = [ {
name: 'a', age: 15, fav: "篮球" }, {
name: 'b', age: 15, fav: "足球" }, {
name: 'c', age: 15, fav: "乒乓球" }, {
name: 'd', age: 15, fav: "排球" }, {
name: 'e', age: 15, fav: "羽毛球" }];
let arr1 = arr.map((item, index) => {
return {
...item, index: index + 1 }
})
Of course, using deep copy combined with map to replace the return statement with one, the result is the same
return Object.assign(item,{
index:index+1})
Print -arr1
simple example 3 - use the index to match the array
let arr = [ {
name: 'a', age: 15, fav: "篮球" }, {
name: 'b', age: 15, fav: "足球" }, {
name: 'c', age: 15, fav: "乒乓球" }, {
name: 'd', age: 15, fav: "排球" }, {
name: 'e', age: 15, fav: "羽毛球" }];
let arr1 = [ {
key: '1', val: 'sss' }, {
key: '2', val: 'fsd' }, {
key: '3', val: 'fds' }, {
key: '4', val: 'fewf' }, {
key: '5', val: 'ewd' }]
let arr2 = arr.map((item, index) => {
return {
...arr1[index], ...item }
});
print arr2 -
4.sort
sort is to sort the array, mainly according to the function passed in, the simplest is numerical sorting
Simple example - 1 - Number sorting
let arr = [1, 5, 2, 8, 10, 53, 9, 4]
let arr2 = arr.sort((a, b) => {
return a - b
})
let arr3 = arr.sort((a, b) => {
return b - a
})
Print arr2, arr3 - an ascending order, a descending order
simple vernacular explanation - pass a comparison function to the sort method, and this function determines the order of its two parameters (a, b) in the sorted array: Assuming the first One argument should come first, the comparison function should return a value less than 0, conversely, assuming the first argument should come after, the function should return a value greater than 0, and, assuming the two values are equal, the function should return 0. You can use this to do more complex sorting
The following is to check whether the elements in the array meet the conditions, and finally some higher-order functions that require boolean
5.some
The some method will detect and return a boolean value without changing the original array. During execution, if one is satisfied, it returns true and does not continue to execute
Simple case - check if an array object contains a certain value
let arr = [ {
name: 'a', age: 15}, {
name: 'c', age: 55}{
name: 'v', age: 14}, {
name: 'd', age: 18} ]
arr.some(item => item.name.includes('a'))
//检测数组，当检测到第一个对象有a,直接返回true
6.every
Different from some, it will check whether each item in the array satisfies the condition, and only if all are satisfied will return true
Simple case - check if all objects in an array satisfy a condition
let arr = [ {
name: 'a', age: 15}, {
name: 'c', age: 55}, {
name: 'v', age: 14}, {
name: 'd', age: 18} ]
arr.every(item => item.age>10)
7.reduce
The method in the callback function will execute the elements in the array, often used for accumulation
Simple example - accumulation of arrays
let arr = [1,5,8,2,10 ]
let a = arr.reduce((total,num)=>{
return total+num
})
console.log(a)
In the same way - you can multiply, understand total as the first object of the array, num is the second, and then operate on it, loop, the second total is the data that has executed the function, and num is the third value
8.find
Find out the item in the array that meets the condition, find an item that meets the condition and directly return the item that meets the condition, and do not search further
simple case
let arr = [ {
name: 'a', age: 15}, {
name: 'c', age: 55},{
name: 'v', age: 14}, {
name: 'd', age: 18} ]
let a = arr.find(item => item.age>10)
console.log(a)
will print the first item in the array
Like, like and collect!!!