how to combine two different array of objects into one new array of object in javascript?

Question

I have two arrays of objects with same news_ids but different properties, I am just wondering how to combine them and get a new array of objects?

For example:

let arr1 = [{
    news_id: 1,
    title: "title1"
  },
  {
    news_id: 2,
    title: "title2"
  },
  {
    news_id: 3,
    title: "title3"
  },
  {
    news_id: 4,
    title: "title4"
  },
]

let arr2 = [{
    news_id: 3,
    count: 3
  },
  {
    news_id: 4,
    count: 4
  }
]

And I would like to get:

[
  {news_id: 1, title: "title1", count: 0},
  {news_id: 2, title: "title2", count: 0},
  {news_id: 3, title: "title3", count: 3},
  {news_id: 4, title: "title4", count: 4}
]

I have tried to use nested loops but it is returning the elements only same ids. — hackrack
– hackrack, Commented Oct 16, 2018 at 10:21
@hackrack, pls mark the answer as an accepted solution if it helped you achieve what you were looking for. Thanks. — Nitish Narang
– Nitish Narang, Commented Oct 16, 2018 at 10:52

Karan · Accepted Answer · 2018-10-16 10:43:23Z

2

You can do that with forEach and filter as below:

arr1.forEach(i => i.count = (arr2.find(j => j.news_id == i.news_id) || { count: 0 }).count)

Try it below.

let arr1 = [{
    news_id: 1,
    title: "title1"
  },
  {
    news_id: 2,
    title: "title2"
  },
  {
    news_id: 3,
    title: "title3"
  },
  {
    news_id: 4,
    title: "title4"
  },
]

let arr2 = [{
    news_id: 3,
    count: 3
  },
  {
    news_id: 4,
    count: 4
  }
]

arr1.forEach(i => i.count = (arr2.find(j => j.news_id == i.news_id) || { count: 0 }).count);
console.log(arr1);

answered Oct 16, 2018 at 10:43

Karan

12.7k3 gold badges31 silver badges45 bronze badges

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

Comments

Nitish Narang · Accepted Answer · 2018-10-16 10:31:55Z

2

This can be done as follows. Also this is generic and will concat all properties for same news_id, not just count and title.

let arr1 = [
              {news_id: 1, title: "title1"},
              {news_id: 2, title: "title2"},
              {news_id: 3, title: "title3"},
              {news_id: 4, title: "title4"},
           ]


let arr2 = [
             {news_id: 3, count: 3},
             {news_id: 4, count: 4}
           ]

let result = Object.values(([...arr1, ...arr2].reduce((acc, d) => (acc[d.news_id] = { count:0, ...acc[d.news_id], ...d }, acc) ,{})))

edited Oct 16, 2018 at 10:31

answered Oct 16, 2018 at 10:26

Nitish Narang

4,2042 gold badges17 silver badges22 bronze badges

2 Comments

Nitish Narang Over a year ago

Yes, @NickParsons I intentionally did generic approach so that other properties can also be taken care of. Though I did add "count" as well there to be more specific.

Nick Parsons Over a year ago

Ah yes, sorry didn't see your comment.

Mohan Rajput · Accepted Answer · 2018-10-16 10:58:04Z

1

In your case to get the desired result.I recommend you should try old school JS forEach() Method.

And here is the example done check it on JS Fiddle Example

let arr1 = [{
    news_id: 1,
    title: "title1"
  },
  {
    news_id: 2,
    title: "title2"
  },
  {
    news_id: 3,
    title: "title3"
  },
  {
    news_id: 4,
    title: "title4"
  }
]

let arr2 = [
    {
    news_id: 3,
    count: 3
  },
  {
    news_id: 4,
    count: 4
  }
]


arr1.forEach(function (e,i) {
    var flag = false;
  arr2.forEach(function (obj, j) {
        if (e.news_id === obj.news_id) {
            e.count = obj.count;
      flag = true;
        }
    });
  if(!flag){
    e.count = 0;
  }
});

answered Oct 16, 2018 at 10:58

Mohan Rajput

6429 silver badges22 bronze badges

Comments

Cobus Kruger · Accepted Answer · 2018-10-16 10:40:34Z

0

Here is a simpler solution. I simply iterate arr1 and add the count from the matching arr2 item, if any.

for (item of arr1) {
    let arr2item = arr2.find(item2 => item2.news_id === item.news_id);
  item['count'] = arr2item ? arr2item.count : 0;
};

@Nitish's answer looks good, but the intention is not very clear.

answered Oct 16, 2018 at 10:40

Cobus Kruger

8,6655 gold badges66 silver badges109 bronze badges

Comments

Nina Scholz · Accepted Answer · 2018-10-16 11:01:38Z

0

You could take a Map for collecting all given data and the counts. Then render the final result.

var array1 = [{ news_id: 1, title: "title1" }, { news_id: 2, title: "title2" }, { news_id: 3, title: "title3" }, { news_id: 4, title: "title4" }],
    array2 = [{ news_id: 3, count: 3 }, { news_id: 4, count: 4 }],
    result = Array.from(
        array2
            .reduce(
                (m, { news_id, count }) => (m.get(news_id).count += count, m),
                array1.reduce((m, o) => m.set(o.news_id, Object.assign({}, o, { count: 0 })), new Map)
            )
            .values()
    );

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Oct 16, 2018 at 11:01

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Collectives™ on Stack Overflow

how to combine two different array of objects into one new array of object in javascript?

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related