Array.prototype.map()
The map() method returns a new array with the same length as the original array, consisting of the return value of each element in the original array after calling a specified method. It does not alter the original array.
const arr = [1, 2, 3]; const double = x => x * 2; arr.map(double); / / (2, 4, 6]Copy the codeArray.prototype.filter()
Create a new array by using a filter function that only preserves elements that return true and not false. The result is an array equal to or less than the length of the original array, containing a subset of the same elements as the original array.
const arr = [1, 2, 3]; const isOdd = x => x % 2 === 1; arr.filter(isOdd); / / [1, 3]Copy the code
Array.prototype.find()
Returns true, the first element returned by the matcher function. The result is a single element in the original array.
const arr = [1, 2, 3]; const isOdd = x => x % 2 === 1; arr.find(isOdd); / / 1Copy the codeArray.prototype.reduce()
Executes the callback function for each element in the array, excluding elements that were deleted or never assigned, taking four arguments: the initial value (or the value returned by the previous callback function), the current element value, the current index, and the array that called Reduce
parameter
Callback (a function that executes each value in the array and contains four arguments)
- PreviousValue (the value returned from the last call to the callback, or the initialValue provided)
- CurrentValue (the element currently being processed in the array)
- Index (index of the current element in the array)
- Array (array of calls to reduce)
InitialValue (as the first argument to the first callback call.)
Parsing the initialValue
const arr = [1, 2, 3, 4]; const sum = arr.reduce(function(prev, cur, index, arr) { console.log(prev, cur, index); return prev + cur; }); console.log(arr, sum); [1, 2, 3, 4] 10 */Copy the codeIndex starts at 1, and the first prev is the first value in the array. The array length is 4, but the reduce function loops three times.
const arr = [1, 2, 3, 4];
const sum = arr.reduce(function (prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
}, 0); //注意这里设置了初始值
console.log(arr, sum);
/*
0 1 0
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10
*/
Copy the codeIndex starts at 0, prev starts at 0, array length is 4, and reduce loops four times.
Conclusion: If no initialValue is provided, Reduce executes the callback method from index 1, skipping the first index. If initialValue is provided, start at index 0.
Note: The initial value provided by reduce is usually more secure. An error will be reported if the current array is empty without an initial value.
const arr = []; const sum = arr.reduce(function(prev, cur, index, arr) { console.log(prev, cur, index); return prev + cur; }); TypeError: Reduce of empty array with no initial valueCopy the codeReduce common usage
const arr = [1, 2, 3];
const sum = (x, y) => x + y;
arr.reduce(sum, 0); // 6
const increment = (x, y) => [...x, x[x.length - 1] + y];
arr.reduce(increment, [0]); // [0, 1, 3, 6]
Copy the codeReduce advanced usage
- Count the number of occurrences of each element in the array
const names = ["Alice", "Bob", "Tiff", "Bruce", "Alice"];
const nameNum = names.reduce((pre, cur) => {
if (cur in pre) {
pre[cur]++;
} else {
pre[cur] = 1;
}
return pre;
}, {}); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}
Copy the code- Array to heavy
const arr = [1, 2, 3, 4, 4, 1]; const newArr = arr.reduce((pre, cur) => { if (! pre.includes(cur)) { return pre.concat(cur); } else { return pre; }} []); // [1, 2, 3, 4]Copy the code- Convert a two-dimensional array to a one-dimensional array
const arr = [ [0, 1], [2, 3], [4, 5], ]; const newArr = arr.reduce((pre, cur) => { return pre.concat(cur); } []); // [0, 1, 2, 3, 4, 5]Copy the code- Convert a multidimensional array to a one-dimensional one
const arr = [
[0, 1],
[2, 3],
[4, [5, 6, 7]],
];
const newArr = function (arr) {
return arr.reduce(
(pre, cur) => pre.concat(Array.isArray(cur) ? newArr(cur) : cur),
[]
);
};
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]
Copy the code- The attributes of the object are summed
const result = [
{
subject: "math",
score: 10,
},
{
subject: "chinese",
score: 20,
},
{
subject: "english",
score: 30,
},
];
const sum = result.reduce(function (prev, cur) {
return cur.score + prev;
}, 0); //60
Copy the code= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =