小编典典

如何在对象数组上调用 reduce 来总结它们的属性?

all

假设我想a.xarr.

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

我有理由相信这a.xundefined在某个时候。

以下工作正常

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

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


阅读 94

收藏
2022-04-13

共1个答案

小编典典

在第一次迭代之后,您将返回一个数字,然后尝试获取x它的属性以添加到下一个对象,该对象是和涉及结果的undefined数学。undefined``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},在迭代 2 中{x: 3}分配给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},// returns 3a下一次迭代一样

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

数字文字3没有(通常)有一个名为的属性x,所以它是undefined并且 undefined + b.x返回NaN并且NaN + <anything>总是NaN

澄清
:我更喜欢我的方法而不是这个线程中的其他最佳答案,因为我不同意传递一个可选参数来减少一个幻数以得到一个数字原语的想法更干净。它可能会导致编写的行数减少,但
imo 可读性较差。

2022-04-13