how to loop inside repeating nested arrays in reactjs

Question

I want to calculate the cost and i am stuck from past 1 hour.Here is my data

Todo: [{
    name: "primary",
    items: [{
        item: 'Todo itme #1',
        isDone: false,
        cost: 0
    }]
}, {
    name: "Secondary",
    items: [{
        item: 'Todo itme #1',
        isDone: false,
        cost: 0
    }]
}]

I want to loop on all items and compute the total cost.

I have tried using for loops
using map within a map

but I am not able so solve it.

Entries inside items array can increase dynamically.

Please guide!

kind user · Accepted Answer · 2017-11-01 12:35:14Z

3

Array#reduce solution.

let Todo = [{
  name: "primary",
  items: [{
    item: 'Todo itme #1',
    isDone: false,
    cost: 3
  }, {
    item: 'Todo itme #2',
    isDone: false,
    cost: 2
  }]
}, {
  name: "Secondary",
  items: [{
    item: 'Todo itme #3',
    isDone: false,
    cost: 1
  }]
}], 
   totalCost = Todo.reduce((s,a) => {
     return s + a.items.reduce((s,a) => s + a.cost, 0);
   }, 0);
  
  console.log(totalCost);

edited Nov 1, 2017 at 12:35

answered Jul 15, 2017 at 18:37

kind user

42k8 gold badges69 silver badges78 bronze badges

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

Comments

Chris · Accepted Answer · 2017-07-15 18:29:03Z

2

You just want to calculate the result of the sum? Then try this:

var sum = 0;
var Todo = [{
  name: "primary",
  items: [{
    item: 'Todo itme #1',
    isDone: false,
    cost: 35
  }]
}, {
  name: "Secondary",
  items: [{
    item: 'Todo itme #1',
    isDone: false,
    cost: 10
  }]
}];

Todo.forEach(function(todo) {
  todo.items.forEach(function(item) {
    sum += item.cost
  });
});

console.log(sum)

answered Jul 15, 2017 at 18:29

Chris

59.7k20 gold badges121 silver badges144 bronze badges

2 Comments

Vikram Saini Over a year ago

thanks a lot Chris.Working fine:) but i was doing the same thing with map instead of forEach and it did not work.Why so?

Vikram Saini Over a year ago

thanks a lot Chris.Working fine:) but i was doing the same thing with map instead of forEach and it did not work.Why so?

Asmaa Almadhoun · Accepted Answer · 2017-07-15 19:23:42Z

this code will not cost time to use it and search for it, I use it always

componentDidMount() {
    let i=0;
    let cost = 0;
    let Todo = [
        {name:"primary",items:[{item:'Todo itme #1',isDone:false,cost:20}]},
        {name:"Secondary",items:[{item:'Todo itme #2',isDone:false,cost:5}]},
    ];
    Todo.map(function( itemElement ){
        let itemElement2 = itemElement.name;
        let item =itemElement.items;
        return [itemElement2, item];
    }).filter(function(value){
        if (typeof value[0] === 'string'){
            console.log( "name " +value[0]  )
        }
        if(typeof value[1] === "object") {
            console.log(
                "item in items : item " + i +" "+
                value[1][0].item + " "+
                value[1][0].isDone + " "+
                value[1][0].cost
            );
            cost+=parseInt(value[1][0].cost);
            console.log(' cost '+cost)
        }
        return value ;
    });

}

Collectives™ on Stack Overflow

how to loop inside repeating nested arrays in reactjs

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related