Typescript - Combine two arrays of objects by field value

Question

I have two different arrays of objects and need them to be combined by specific value of field.

array1 =
[
  { id: "id7", dateCreated: "2017-01-24", client: "Clipper"}, 
  { id: "id2", dateCreated: "2017-01-22", client: "Sniper" },
  { id: "id3", dateCreated: "2017-02-22", client: "Beeper" }
  { id: "id1", dateCreated: "2017-01-29", client: "Reaper" }
]

array2 =
[
  { id: "id2", dateExpired: "2020-01-24"}, 
  { id: "id1", dateExpired: "2020-01-22"}
]

I am expecting to get something like that in the end:

newData =
[
  { id: "id7", dateCreated: "2017-01-24", client: "Clipper"}, 
  { id: "id2", dateCreated: "2017-01-22", client: "Sniper", dateExpired: "2020-01-24" },
  { id: "id3", dateCreated: "2017-02-22", client: "Beeper" }
  { id: "id1", dateCreated: "2017-01-29", client: "Reaper", dateExpired: "2020-01-22" }
]

There are lots of fields in each and they are not sorted so I have to find the proper array2 object first and then combine them.

I have tried the following and unfortunately for some reason it either not reach the if statement or don't push new lines to newData.

let newData = [];
array1.forEach((item, row) => {
   let find = array2.find((element) => {
     return item.id===element.id
   });

   if (find) newData.push(Object.assign({},item,find));

});

return item.id=element.id The equality operators in JavaScript/TypeScript are == and ===. = is the assignment operator. — JLRishe
– JLRishe, Commented Feb 14, 2019 at 16:55

p.s.w.g · Accepted Answer · 2019-02-14 17:07:51Z

4

The main issue with your original code is that you were using = (the assignment operator) instead of == or === (comparison operators). But you can simplify your code even more using Array.prototype.map and some es6 syntax:

const array1 =
[
  { id: "id7", dateCreated: "2017-01-24", client: "Clipper"}, 
  { id: "id2", dateCreated: "2017-01-22", client: "Sniper" },
  { id: "id3", dateCreated: "2017-02-22", client: "Beeper" },
  { id: "id1", dateCreated: "2017-01-29", client: "Reaper" },
];
const array2 =
[
  { id: "id2", dateExpired: "2020-01-24"}, 
  { id: "id1", dateExpired: "2020-01-22"},
];
const newData = array1.map((item, row) => {
   const found = array2.find((element) => item.id == element.id);
   return { ...item, ...found };
});
console.log(newData);

edited Feb 14, 2019 at 17:07

answered Feb 14, 2019 at 17:01

p.s.w.g

150k31 gold badges307 silver badges339 bronze badges

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

2 Comments

Patrick Roberts Over a year ago

The (found || {}) is unnecessary. The object spread syntax can be applied to undefined directly.

p.s.w.g Over a year ago

@PatrickRoberts Thanks for pointing that out. I think I knew that at some point but I had forgotten.

JLRishe · Accepted Answer · 2019-02-14 17:00:09Z

1

Three problems:

You are trying to use = to compare the IDs instead of == or ===.
The variable for your array is named newData, but you are trying to push to a variable named newArray.
You are conditionally pushing to the array, when you should instead always push to the new array and conditionally merge in the found object if there is one.

After fixing these, and the missing comma in array1, it produces the described result:

let array1 = [{
    id: "id7",
    dateCreated: "2017-01-24",
    client: "Clipper"
  },
  {
    id: "id2",
    dateCreated: "2017-01-22",
    client: "Sniper"
  },
  {
    id: "id3",
    dateCreated: "2017-02-22",
    client: "Beeper"
  }, {
    id: "id1",
    dateCreated: "2017-01-29",
    client: "Reaper"
  }
]

let array2 = [{
    id: "id2",
    dateExpired: "2020-01-24"
  },
  {
    id: "id1",
    dateExpired: "2020-01-22"
  }
]

let newData = [];
array1.forEach((item, row) => {
  let find = array2.find((element) => {
    return item.id === element.id
  });

  newData.push(Object.assign({}, item, find || {}));
});

console.log(newData);

answered Feb 14, 2019 at 17:00

JLRishe

102k19 gold badges138 silver badges171 bronze badges

3 Comments

Nick Over a year ago

Thank you. First two items just typo on rewriting the code manually. For some reason it returns it as newData = [ { id: "id7", dateCreated: "2017-01-24", client: "Clipper", dateExpired: "2020-01-22"}, { id: "id2", dateCreated: "2017-01-22", client: "Sniper", dateExpired: "2020-01-22" }, { id: "id3", dateCreated: "2017-02-22", client: "Beeper", dateExpired: "2020-01-22" } { id: "id1", dateCreated: "2017-01-29", client: "Reaper", dateExpired: "2020-01-22" } ] just adding the data from array2 to each in array1

JLRishe Over a year ago

@Nick Sounds like you still have the = problem. Did you actually fix that in your code?

Nick Over a year ago

Definitely, had to rewrite it manually. So it was the reason of typo here. None of such issues in my code. Still, lot of thanks for your sharp eye and help)

Patrick Roberts · Accepted Answer · 2019-02-14 17:02:48Z

Assuming array2 entries all have unique IDs, you can preprocess it into an object that behaves like a lookup table to get a faster lookup by id before applying Array.prototype.map() to array1:

const array1 = [
  { id: "id7", dateCreated: "2017-01-24", client: "Clipper" }, 
  { id: "id2", dateCreated: "2017-01-22", client: "Sniper" },
  { id: "id3", dateCreated: "2017-02-22", client: "Beeper" },
  { id: "id1", dateCreated: "2017-01-29", client: "Reaper" }
]

const array2 = [
  { id: "id2", dateExpired: "2020-01-24" }, 
  { id: "id1", dateExpired: "2020-01-22" }
]

const results = array1.map(
  function (value) {
    return { ...value, ...this[value.id] }
  },
  array2.reduce(
    (lut, value) => Object.assign(lut, { [value.id]: value }),
    {}
  )
)

console.log(results)

Collectives™ on Stack Overflow

Typescript - Combine two arrays of objects by field value

3 Answers 3

2 Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related