Javascript (Vuejs) object literal, looping

Question

I have an object in vuejs

 data: {
    food: {
              monday: {
              pizza:1,
              chips:2,
              pie:0,      
          },
             tuesday: {
              pizza:1,
              chips:2,
              pie:1,       
              }
           }
}

I can access the value specifically with

this.food.monday.pizza

but how do I count the number of items eaten on monday (3 total)?

str · Accepted Answer · 2016-03-29 16:48:43Z

4

In ES6 you can do it as follows.

const objectValueSum = (obj) =>
    Object.keys(obj)
        .map(food => obj[food])
        .reduce((a, b) => a + b);

const sum = objectValueSum(this.data.food.monday);

Object.keys returns the object keys
map returns an array of the amounts
reduce sums up all the amounts

Don't forget to use Babel or Traceur for transpiling to ES5.

answered Mar 29, 2016 at 16:48

str

45.5k18 gold badges117 silver badges134 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Yerko Palma Over a year ago

Objects.keys, map and reduce are functions from ES5, only the arrow notation is from ES6 in your code

Collectives™ on Stack Overflow

Javascript (Vuejs) object literal, looping

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related