Javascript Objects - merge an array of object with some classicals objects

Question

I'm trying to merge an array of object in javascript with some classicals objects. But I obtain a weird big object with some array of object and some individuals objects like this:

Here a demo of my configuration.

Here the two objects I want to merge:

var object1 = {
  "5b7973bdce3eb938a6de86a3": { addAt: 1534727291296, quantity: 1 },
  "5b7973bdce3eb938a6de86a5": { addAt: 1534727292889, quantity: 1 },
  "5b7973bdce3eb938a6de86a7": { addAt: 1534727297106, quantity: 1 }
};

var object2 = [
  {
    id: "5b7973bdce3eb938a6de86a3",
    category: "main dish",
    ingredients:
      " Peeled groundnuts ↵ Onion, garlic, pepper, salt ↵ Vegetable oil ↵  Ground crayfish ↵  Meat",
    price: "5.50"
  },
  {
    id: "5b7973bdce3eb938a6de86a5",
    category: "entry",
    ingredients:
      "1.2kg (2.6 lbs) goat meat (cut with the skin) ↵ 2 …g spoon vegetable oil. ↵  Black pepper (optional)",
    price: "6.50"
  },
  {
    id: "5b7973bdce3eb938a6de86a7",
    category: "appetizers",
    ingredients:
      "2 cups of warm water. ↵   2 tsp. baking powder. ↵ …ar. ↵    2 tsps. vegetable oil. ↵  Pinch of salt.",
    price: "5.00"
  }
];

Wished result:

       // for each object, merge addAt and quantity with previous object
       {
        id: "5b7973bdce3eb938a6de86a7",
        category: "appetizers",
        ingredients:
          "2 cups of warm water. ↵   2 tsp. baking powder. ↵ …ar. ↵    2 tsps. vegetable oil. ↵  Pinch of salt.",
        price: "5.00",
        quantity: 1,
        addAt: 1534727297106 
      }

Obtained result from my console.log:

// one big object, not merged
{
0:
{id: "5b7973bdce3eb938a6de86a3", category: "main dish", ingredients: " Peeled groundnuts ↵ Onion, garlic, pepper, salt, maggi ↵ Vegetable oil ↵  Ground crayfish ↵  Meat", price: "5.50", …}
1:
{id: "5b7973bdce3eb938a6de86a5",  category: "entry", ingredients: "1.2kg (2.6 lbs) goat meat (cut with the skin) ↵ 2 …g spoon vegetable oil. ↵  Black pepper (optional)", price: "6.50", …}
2:
{id: "5b7973bdce3eb938a6de86a7", category: "appetizers", ingredients: "2 cups of warm water. ↵   2 tsp. baking powder. ↵ …ar. ↵    2 tsps. vegetable oil. ↵  Pinch of salt.", price: "5.00", …}

5b7973bdce3eb938a6de86a3:
{addAt: 1534727291296, quantity: 1}

5b7973bdce3eb938a6de86a5:
{addAt: 1534727292889, quantity: 1}

5b7973bdce3eb938a6de86a7:
{addAt: 1534727297106, quantity: 1}
}

object2 =

I have tried so far these differents methods:

Object.keys(this.props.data.compilation).map((key, index) => {
  if(this.props.data.compilation[key] === this.props.articles[index]) { 
    this.props.data.compilation[index].quantity = this.props.articleID[key]["quantity"] 
    return compilation = Object.assign({}, this.props.data.compilation[key], {
      quantity : this.props.articles[index][quantity] 
    }, { 
      addAt: this.props.articles[index][addAt]
    })
  }
})

Object.keys(this.props.data.compilation).map((key, index) => {
  if(this.props.data.compilation[key] === this.props.articles[index]) { 
    this.props.data.compilation[index].addAt = this.props.articleID[key]["addAt"], 
    this.props.data.compilation[index].quantity = this.props.articleID[key]["quantity"] 

  }
})

// lodash method
var compilation = _.merge( {},  this.props.data.compilation, this.props.articles)


//lodash method
var compilation = _.assign( {},  this.props.data.compilation, this.props.articles)

None of them works so far as I would. Why my object doesn't merge properly ? Any hint would be great, thanks.

Here you can view the object to start with I have taken from my console.log codesandbox.io/s/x2q3jwp1rq , I add the method then. — Diagathe Josué
– Diagathe Josué, Commented Aug 20, 2018 at 1:15
Are both this.props.data.compilation and this.props.articles arrays of objects? Do you want to concat them? — ibrahim mahrir
– ibrahim mahrir, Commented Aug 20, 2018 at 1:16
Also please provide an example of the objects/arrays and the desired output of their merging. — ibrahim mahrir
– ibrahim mahrir, Commented Aug 20, 2018 at 1:24
I have update my sandbox. Okay I will put some example in my post, no I think there is an object with several objects, and an array object — Diagathe Josué
– Diagathe Josué, Commented Aug 20, 2018 at 1:24

ibrahim mahrir · Accepted Answer · 2018-08-20 01:32:53Z

Just map object2 into a new array of objects. For each object in object2 create a new object that is the fusion of it with the equivalent object from object1 (retrieved using the id property):

var result = object2.map(o => Object.assign({}, o, object1[o.id]));

Example:

var object1 = {"5b7973bdce3eb938a6de86a3":{"addAt":1534727291296,"quantity":1},"5b7973bdce3eb938a6de86a5":{"addAt":1534727292889,"quantity":1},"5b7973bdce3eb938a6de86a7":{"addAt":1534727297106,"quantity":1}};

var object2 = [{"id":"5b7973bdce3eb938a6de86a3","category":"main dish","ingredients":" Peeled groundnuts ↵ Onion, garlic, pepper, salt ↵ Vegetable oil ↵  Ground crayfish ↵  Meat","price":"5.50"},{"id":"5b7973bdce3eb938a6de86a5","category":"entry","ingredients":"1.2kg (2.6 lbs) goat meat (cut with the skin) ↵ 2 …g spoon vegetable oil. ↵  Black pepper (optional)","price":"6.50"},{"id":"5b7973bdce3eb938a6de86a7","category":"appetizers","ingredients":"2 cups of warm water. ↵   2 tsp. baking powder. ↵ …ar. ↵    2 tsps. vegetable oil. ↵  Pinch of salt.","price":"5.00"}];

var result = object2.map(o => Object.assign({}, o, object1[o.id]));

console.log(result);

Collectives™ on Stack Overflow

Javascript Objects - merge an array of object with some classicals objects

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related