JavaScript reduce不处理对象

uinbv5nw  于 11个月前  发布在  Java
关注(0)|答案(7)|浏览(112)

我想知道reduce是如何工作的。

var expense = [
    {
        item: "Bed",
        cost: 1499,
        date: "02-23-2018"
    },
    {
        item: "Phone",
        cost: 2499,
        date: "02-23-2018"
    },
    {
        item: "Book",
        cost: 400,
        date: "02-23-2018"
    },
    {
        item: "Mattress",
        cost: 700,
        date: "02-23-2018"
    },
    {
        item: "Food",
        cost: 300,
        date: "02-23-2018"
    }
];

var totalExpense = expense.reduce(function (a, b) {
    console.log(a.cost, b.cost);
    return a.cost + b.cost;
});

console.log(totalExpense);

字符串
这给出了总计数为NaN
输出量:

1499 2499
undefined 400
undefined 700
undefined 300
NaN


当我对一个简单的expense数组执行相同的操作时,它工作得很好。

luaexgnf

luaexgnf1#

传递给reduce回调函数的第一个参数是前一个值(a)--或者是传递给reduce的第二个参数(初始值)

[].reduce(function(a, b) { ... }, 0);
          ^ callback              ^ initial value

字符串
a将保存每次前一次迭代的结果,因此要获得所有成本的总和,只需添加b.cost

var expense = [{
    item: 'Bed',
    cost: 1499,
    date: '02-23-2018'
  },
  {
    item: 'Phone',
    cost: 2499,
    date: '02-23-2018'
  },
  {
    item: 'Book',
    cost: 400,
    date: '02-23-2018'
  },
  {
    item: 'Mattress',
    cost: 700,
    date: '02-23-2018'
  },
  {
    item: 'Food',
    cost: 300,
    date: '02-23-2018'
  }
];
var totalExpense = expense.reduce(function(a, b) {
  return a + b.cost;
}, 0);

console.log(totalExpense);


使用es6语法,您可以使其成为一行程序

var totalExpense = expense.reduce((a, {cost}) => a + cost, 0);

9rygscc1

9rygscc12#

你需要提供一个初始值,它有一个cost字段,以便在累加器中引用它。你需要返回这个对象:

expense.reduce(function(acc, curr){
    console.log(acc.cost, curr.cost);
    acc.cost += curr.cost;
    return acc;
    }, { cost: 0 });

字符串
注意使用比ab更有意义的变量名。这将使您的代码更容易理解。Array.prototype.reduce回调应该有一个累加器和当前值。这样命名可以帮助您自己。初始值提供了一个带有cost字段的对象,您可以在其中写下累加值。
注意,如果你想的话,你也可以在这里使用一个vanilla变量。如果你实际上不需要一个对象:

var total = expense.reduce(function(acc, curr){
    acc += curr.cost;
    return acc;
    }, 0);
 console.log(total);
 >> 5398

m2xkgtsf

m2xkgtsf3#

无论下一个a应该是什么,你都需要returna.cost + b.cost是一个数字。它没有cost属性,所以a.cost在第一次迭代后将是undefined
只需要提供一个初始值0。同时考虑给你的参数取更合适的名字。

var totalExpense = expense.reduce(function(sum, item){
  return sum + item.cost;
}, 0);

字符串

zsohkypk

zsohkypk4#

你需要一个初始值。reduce函数把累计值作为第一个参数,集合的下一个元素作为第二个参数

var totalExpense = expense.reduce(function(accumulator, current) {
console.log({ accumulator: accumulator, currentCost: current.cost });
return accumulator + current.cost;
}, 0);

console.log({ totalExpense: totalExpense });

字符串

ccgok5k5

ccgok5k55#

//通过reduce方法计算总成本
let totallogs = expense.reduce((tem,瓦尔)=> tem+= val. cost,0)console.log(totallogs)

jmp7cifd

jmp7cifd6#

expense.reduce((sum, cur) => ({ cost: sum.cost + cur.cost })).cost;

字符串

更新正如@Viktor指出的,我以前没有考虑特殊情况。

function getTotelExpense(expense) {
    if (expense.length > 0 && expense[0].hasOwnProperty("cost"))
        return expense.reduce((sum, cur) => ({ cost: sum.cost + cur.cost })).cost;
    else return 0;
}


您可以在TypeError: Reduce of empty array with no initial value | MDN中了解更多信息

dauxcl2d

dauxcl2d7#

这里有另一种方法,你可以使用泛型函数foldMap来完成它-关于这个漂亮的函数的更多指导,我推荐this video

const totalExpense =
  expense.foldMap (item => item.cost, 0)

console.log (totalExpense)
// 5398

字符串
为此,您需要定义Array.prototype.foldMapNumber.prototype.concat--但是实现和定义位置取决于您

Array.prototype.foldMap = function (f, acc)
{
  return this.reduce ((acc, x, i) =>
    acc.concat (f (x, i, this)), acc)
}

Number.prototype.concat = function (m)
{
  return this + m
}


这里有一个功能代码粘贴

Array.prototype.foldMap = function (f, acc)
{
  return this.reduce ((acc, x, i) =>
    acc.concat (f (x, i, this)), acc)
}

Number.prototype.concat = function (m)
{
  return this + m
}

const expense =
  [ { item: 'Bed'
    , cost: 1499
    , date: '02-23-2018'
    }
  , { item: 'Phone'
    , cost: 2499
    , date: '02-23-2018'
    }
  , { item: 'Book'
    , cost: 400
    , date: '02-23-2018'
    }
  , { item: 'Mattress'
    , cost: 700
    , date: '02-23-2018'
    }
  , { item: 'Food'
    , cost: 300
    , date: '02-23-2018'
    }
  ]
  
const totalExpense =
  expense.foldMap (item => item.cost, 0)

console.log(totalExpense)
// 5398

相关问题