在第一次迭代之后，你返回一个数字，然后试图获得它的属性x，以添加到下一个对象，这是未定义的，数学涉及未定义的结果在NaN。

尝试返回一个包含x属性和参数x属性的对象:

var arr = [{x:1},{x:2},{x:4}];

arr.reduce(function (a, b) {
  return {x: a.x + b.x}; // returns object with property x
})

// ES6
arr.reduce((a, b) => ({x: a.x + b.x}));

// -> {x: 7}

评论中增加的解释:

[]的每次迭代的返回值。Reduce作为下一次迭代的a变量。

迭代1:a = {x:1}， b = {x:2}， {x: 3}分配给迭代2中的a

迭代2:a = {x:3}， b = {x:4}。

你的例子的问题是你返回的是一个数字文字。

function (a, b) {
  return a.x + b.x; // returns number literal
}

迭代1:a = {x:1}， b = {x:2}， //在下一次迭代中返回3作为a

迭代2:a = 3, b = {x:2}返回NaN

数字文字3(通常)没有名为x的属性，因此它是未定义的，未定义+ b.x返回NaN, NaN + <任何>总是NaN

澄清:我更喜欢我的方法，而不是这个帖子中的其他答案，因为我不同意通过一个可选参数来减少一个神奇的数字来获得一个数字原语的想法。这可能会导致写的行数更少，但在我看来，可读性更差。

一个更简洁的方法是提供一个初始值作为reduce的第二个参数:

Var arr = [{x:1}， {x:2}， {x:4}]; Var结果= arr。Reduce(函数(acc, obj){返回acc + obj.x;}, 0); console.log(结果);/ / 7

第一次调用匿名函数时，使用(0，{x: 1})调用它，并返回0 + 1 = 1。下一次，它被(1，{x: 2})调用，并返回1 + 2 = 3。然后用(3，{x: 4})调用它，最后返回7。

这也可以处理数组为空的情况，返回0。

其他人已经回答了这个问题，但我认为我应该提出另一种方法。你可以结合一个映射(从a.x到x)和reduce(把x相加)，而不是直接对a.x求和:

arr = [{x:1},{x:2},{x:4}]
arr.map(function(a) {return a.x;})
   .reduce(function(a,b) {return a + b;});

不可否认，它可能会稍微慢一些，但我认为值得把它作为一个选项提出来。

如果你有一个包含大量数据的复杂对象，比如一个对象数组，你可以采取一步一步的方法来解决这个问题。

如:

const myArray = [{ id: 1, value: 10}, { id: 2, value: 20}];

首先，你应该将你的数组映射到一个你感兴趣的新数组，在这个例子中它可能是一个新的值数组。

const values = myArray.map(obj => obj.value);

这个回调函数将返回一个只包含原始数组中的值的新数组，并将其存储在values const中。现在你的values const是一个这样的数组:

values = [10, 20];

现在你已经准备好执行reduce了:

const sum = values.reduce((accumulator, currentValue) => { return accumulator + currentValue; } , 0);

如您所见，reduce方法多次执行回调函数。对于每一次，它都取数组中该项的当前值，并与累加器相加。为了正确地求和，你需要将累加器的初始值设置为reduce方法的第二个参数。

现在你有了新的const sum值为30。

在reduce的每一步中，你不会返回一个新的{x:??}对象。所以你要么需要做:

arr = [{x:1},{x:2},{x:4}]
arr.reduce(function(a,b){return a + b.x})

或者你需要这样做

arr = [{x:1},{x:2},{x:4}]
arr.reduce(function(a,b){return {x: a.x + b.x}; }) 

返回所有x个道具的和:

arr.reduce(
(a,b) => (a.x || a) + b.x 
)