compare two arrays having different number of properties and mapping a third array with compared values on condition using javascript

Question

I have 2 arrays

var array1 = ["1", "2", "3", "4", "5", "6"]

and

var array2 = [
  { offId: "4", offname: "four" },
  { offId: "9", offname: "nine" },
  { offId: "15", offname: "fifteen" },
  { offid: "3", offname: "three" },
  { offId: "1", offname: "one" },
  { offId: "0", offname: "zero" },
  { offId: "8", offname: "eight" },
  { offId: "10", offname: "ten" },
]

i need to compare two arrays with the values of offId and the resulted array should be

var array3 = [
  { offId: "1", offname: "one" },
  { offId: "2", offname: "" },
  { offId: "3", offname: "three" },
  { offId: "4", offname: "four" },
  { offId: "5", offname: "" },
  { offId: "6", offname: "" },
]

How could i achieve this(length of the array may be same or different)

Answer 1

 var array1 = ["1", "2", "3", "4", "5", "6"]; var array2 = [ { offId: "4", offname: "four" }, { offId: "9", offname: "nine" }, { offId: "15", offname: "fifteen" }, { offId: "3", offname: "three" }, { offId: "1", offname: "one" }, { offId: "0", offname: "zero" }, { offId: "8", offname: "eight" }, { offId: "10", offname: "ten" }, ]; var array3 = array1.map(val => array2.filter(obj => obj.offId == val)[0] || { offId: val, offname: "" }); console.log(array3); 

Answer 2

The easiest way would be to simply filter() the second array:

const array3 = array2.filter(v => array1.includes(v.offId));

That will loop through every element in array2 and only leave the ones which have their offId in array1 .

If you need it sorted, then just add a sort to the end of that:

const array3 = array2.filter(v => array1.includes(v.offId))
  .sort((a, b) => b.offId > a.offId ? 1 : a.offId < b.offId ? -1 : 0);

If you need to sort it numerically (ie, you want 2 before 10), then you'll need to cast the values of those, but then you can just subtract them:

const array3 = array2.filter(v => array1.includes(v.offId))
  .sort((a, b) => parseInt(b.offId) - parseInt(a.offId));

Answer 3

You could take a Map and use either the stored object or a new object.

 var array1 = ["1", "2", "3", "4", "5", "6"], array2 = [{ offId: "4", offname: "four" }, { offId: "9", offname: "nine" }, { offId: "15", offname: "fifteen" }, { offId: "3", offname: "three" }, { offId: "1", offname: "one" }, { offId: "0", offname: "zero" }, { offId: "8", offname: "eight" }, { offId: "10", offname: "ten" }], map = array2.reduce((m, o) => m.set(o.offId, o), new Map), result = array1.map(offId => map.get(offId) || { offId, offname: '' }); console.log(result); 

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

Answer 4

You can use Array.reduce to create array3 from array1 & array2 .

Here are the steps :

• acc (accumulated array) will contain the empty array initially.
• Use Array.find to check if the curr (current variable) is in array2.
• Array.find will return the object if a.offId matches the curr value.
• If obj is found, push the obj in acc (accumulated array)
• Else push the {offId: curr, offname: ''} in the array

 var array1 = ["1", "2", "3", "4", "5", "6"] var array2 = [ { offId: "4", offname: "four" }, { offId: "9", offname: "nine" }, { offId: "15", offname: "fifteen" }, { offId: "3", offname: "three" }, { offId: "1", offname: "one" }, { offId: "0", offname: "zero" }, { offId: "8", offname: "eight" }, { offId: "10", offname: "ten" }, ] var array3 = array1.reduce((acc, curr) => { var obj = array2.find(a => a.offId === curr); if (obj) { acc.push(obj); } else { acc.push({ offId: curr, offname: ""}); } return acc; }, []); console.log(array3);