假设我想对arr中的每个元素求和。

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

我有理由相信a。x在某些时候是没有定义的。

以下工作正常

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

第一个例子中我做错了什么?


当前回答

function aggregateObjectArrayByProperty(arr, propReader, aggregator, initialValue) {
  const reducer = (a, c) => {
    return aggregator(a, propReader(c));
  };
  return arr.reduce(reducer, initialValue);
}

const data = [{a: 'A', b: 2}, {a: 'A', b: 2}, {a: 'A', b: 3}];

let sum = aggregateObjectArrayByProperty(data, function(x) { return x.b; }, function(x, y) { return x + y; }, 0);
console.log(`Sum = ${sum}`);
console.log(`Average = ${sum / data.length}`);

let product = aggregateObjectArrayByProperty(data, function(x) { return x.b; }, function(x, y) { return x * y; }, 1);
console.log(`Product = ${product}`);

只是根据之前给出的解写了一个泛型函数。我是一名Java开发人员,所以为任何错误或非javascript标准道歉:-)

其他回答

数组缩减函数接受三个参数,即initialValue(默认值) 它是0),累加器和当前值。 默认情况下,initialValue的值为“0”。这是由 蓄电池

让我们用代码来看看。

var arr =[1,2,4] ;
arr.reduce((acc,currVal) => acc + currVal ) ; 
// (remember Initialvalue is 0 by default )

//first iteration** : 0 +1 => Now accumulator =1;
//second iteration** : 1 +2 => Now accumulator =3;
//third iteration** : 3 + 4 => Now accumulator = 7;
No more array properties now the loop breaks .
// solution = 7

同样的例子还有initial Value:

var initialValue = 10;
var arr =[1,2,4] ;
arr.reduce((acc,currVal) => acc + currVal,initialValue ) ; 
/
// (remember Initialvalue is 0 by default but now it's 10 )

//first iteration** : 10 +1 => Now accumulator =11;
//second iteration** : 11 +2 => Now accumulator =13;
//third iteration** : 13 + 4 => Now accumulator = 17;
No more array properties now the loop breaks .
//solution=17

同样适用于对象数组(当前的stackoverflow问题):

var arr = [{x:1},{x:2},{x:4}]
arr.reduce(function(acc,currVal){return acc + currVal.x}) 
// destructing {x:1} = currVal;
Now currVal is object which have all the object properties .So now 
currVal.x=>1 
//first iteration** : 0 +1 => Now accumulator =1;
//second iteration** : 1 +2 => Now accumulator =3;
//third iteration** : 3 + 4 => Now accumulator = 7;
No more array properties now the loop breaks 
//solution=7

要记住的一件事是InitialValue默认为0,可以给任何我的意思{},[]和数字

一个更简洁的方法是提供一个初始值作为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。

在第一次迭代之后,你返回一个数字,然后试图获得它的属性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

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

var arr = [{x:1}, {x:2}, {x:3}];
arr.map(function(a) {return a.x;})
.reduce(function(a, b) {return a + b});
console.log(arr);
//I tried using the following code and the result is the data array
//result = [{x:1}, {x:2}, {x:3}];
var arr2 = [{x:1}, {x:2}, {x:3}]
.reduce((total, thing) => total + thing.x, 0);
console.log(arr2);
// and I changed the code to like this and it worked.
// result = 6

我在ES6中做了一点改进:

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

返回数