Open webVueBlog opened 4 years ago
实例 计算数组元素相加后的总和:
var numbers = [1,2,3,4,5];
function getSum(total, num) {
return total + num;
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduce(getSum);
}
输出结果:
15
定义和用法 reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。
参数
function(total,currentValue, index,arr)
必需。用于执行每个数组元素的函数。
参数 | 描述 |
---|---|
total | 必需。初始值, 或者计算结束后的返回值。 |
currentValue | 必需。当前元素 |
currentIndex | 可选。当前元素的索引 |
arr | 可选。当前元素所属的数组对象。 |
initialValue可选。传递给函数的初始值
实例 四舍五入后计算数组元素的总和:
<button onclick="myFunction()">点我</button>
<p>数组元素之和: <span id="demo"></span></p>
<script>
var numbers = [10.5, 20.3, 10.1, 30.7];
function getSum(total, num) {
return total + Math.round(num);
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduce(getSum, 0);
}
</script>
该方法reduce()应用了一个函数,该函数是“累加器”,并且处理列表的每个值(从左到右)以将其减小为单个值。
JavaScript Demo: Array.reduce()
const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15
结果:
> 10
> 15
arr .reduce(回调)
arr .reduce (回调,InitialValue)
reduce()callback对数组中存在的每个元素执行一次功能,并忽略数组中的空元素。该函数callback使用四个参数:
换句话说,如果valeurInitiale未提供,reduce将从索引1执行回调函数,并将数组的第一个值(索引0)用于valeurInitiale。
代码:
[0, 1, 2, 3, 4].reduce(function(accumulateur, valeurCourante, index, array){
return accumulateur + valeurCourante;
});
结果:
10
使用箭头功能
[0, 1, 2, 3, 4].reduce(
(accumulateur, valeurCourante) => accumulateur + valeurCourante;
);
添加数组的所有值
var total = [0, 1, 2, 3].reduce((a, b)=> a + b,0);
// total == 6
展平列表清单
var applati = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
return a.concat(b);
});
// applati vaut [0, 1, 2, 3, 4, 5]
从阵列中删除重复项
let tableauAvecDoublons = [1, 2, 3, 1, 4, 5, 4, 6];
let tableauSansDoublon = Array.from(new Set(tableauAvecDoublons));
console.table(tableauSansDoublon); // [1, 2, 3, 4, 5, 6]
用 reduce()
var tableauAvecDoublons = [1, 2, 3, 1, 4, 5, 4, 6];
var tableauSansDoublon = tableauAvecDoublon.reduce(function (acc, valCourante) {
if(acc.indexOf(valCourante) === -1) {
acc.push(valCourante);
}
return acc
}, []);
console.log(tableauSansDoublon); // [1, 2, 3, 4, 5, 6]
[js]