使用reduce对数组对象的amount属性求和返回undefined问题排查

我有一个包含多个对象的数组，每个对象都有一个整数类型的amount属性，想用reduce方法把这些值加起来，结果却返回了undefined。奇怪的是，我用console.log()打印currentValue.amount的时候，明明能拿到正确的数值，实在搞不懂哪里出问题了。

我的错误代码如下：

let items = [ { id: 0, name: "Food", amount: 30000 }, { id: 1, name: "Insurance", amount: 25000 }, { id: 2, name: "Rent", amount: 50000 } ]
let total = items.reduce((a, b) => {
	console.log(b.amount); // 第一次循环输出30000
	a + b.amount; // 这里没有返回值，默认是undefined
}, 0);
console.log(total); // 输出undefined

我期望的结果是把所有amount的值加起来，得到105000并赋值给total。

这个问题的核心非常直接：你在reduce的回调函数里漏掉了return语句！

当你使用带花括号的箭头函数时，函数不会自动返回表达式的结果——你必须显式写出return，否则每一轮reduce的累积值a都会被替换成undefined，最终整个reduce方法的返回值也就是undefined了。而console.log(b.amount)只是执行了打印操作，它不影响函数的返回值。

修正后的代码只需要补上return即可：

let items = [ { id: 0, name: "Food", amount: 30000 }, { id: 1, name: "Insurance", amount: 25000 }, { id: 2, name: "Rent", amount: 50000 } ]
let total = items.reduce((a, b) => {
	console.log(b.amount); // 第一次循环输出30000
	return a + b.amount; // 显式返回累积的总和
}, 0);
console.log(total); // 输出105000，符合预期

另外，如果你想简化代码，还可以去掉花括号，让箭头函数自动返回表达式结果：

let total = items.reduce((a, b) => a + b.amount, 0);

内容的提问来源于stack exchange，提问作者sidiousvic