console.log(movements);
● 例如上述这个列表存储了一个用户每次取钱和存钱的一个过程,我们要将这个数组中所有的数组加起来,来了解他的余额到底有多少钱,这就需要用到reduce方法
const balance = movements.reduce(function (acc, cur, i, arr) {
return acc + cur;
}, 0);
console.log(balance);
注:
1. reduce的回调函数中可以接受四个参数,它们分别是:
● 累加器(accumulator):累加器是reduce函数的第一个参数,它是上一次回调函数的返回值,或者是初始值(如果没有提供初始值的话)。
● 当前元素(current element):当前正在处理的数组元素。
● 当前索引(current index):当前正在处理的数组元素的索引。
● 原数组(array):调用reduce方法的数组本身。
2. reduce参数中最后会给一个初始值,为0
● 我们可以打印除每一步的累加情况
const balance = movements.reduce(function (acc, cur, i, arr) {
console.log(`Iteration ${i}: ${acc}`);
return acc + cur;
}, 0);
console.log(balance);
● 当然我们也可以使用for…of来实现同样的效果
let balance2 = 0;
for (const mov of movements) balance2 += mov;
console.log(balance2);
● 上面的reduce方法我们也可以使用箭头函数的方式来简化代码
const balance = movements.reduce((acc, cur) => acc + cur, 0);
console.log(balance);
● 现在我们就可以通过这个方法来计算这个页面的用户余额了
const calcDisplayBalance = function (movements) {
const balance = movements.reduce((acc, mov) => acc + mov, 0);
labelBalance.textContent = `${balance} EUR`;
};
calcDisplayBalance(account1.movements);
● 这个目前需要手动去执行账户中的key,后面会慢慢的去优化
● 但是请记住,reduce不仅仅是计算数组中的和,它的作用是可以将数组变为一个单一的值,比如也可以计算数组的最大值
const maxNum = movements.reduce((acc, cur) => {
if (acc > cur) {
return acc;
} else {
return cur;
}
}, movements[0]);
console.log(maxNum);