Assigning value 0 to unmatched item in two different array

Viewed 35

The following code has two different array with a common field (key). I am using that key to combine these array and result a new array.

const listA = [
  {"id": 1, "name":"Rohit"},
  {"id": 2, "name":"Raj"},
  {"id": 3, "name":"Maggie"}
]
const listB = [
  {"id": 1, "count": 30},
  {"id": 2, "count": 20}
]
const merge = listA.map(a => ({
  ...listB.find((b) => (b.id === a.id) && b), ...a
}))

console.log(merge)
How can I achieve 'count' : 0 for unmatched items from ListA ? I meant how can I achive following output:

[
  {
    "id": 1,
    "count": 30,
    "name": "Rohit"
  },
  {
    "id": 2,
    "count": 20,
    "name": "Raj"
  },
  {
    "id": 3,
    "count": 0
    "name": "Maggie",
  }
]
5 Answers

Either you define count before the spread operator override (or not) the key.

const listA = [{
    id: 1,
    name: 'Rohit',
  },
  {
    id: 2,
    name: 'Raj',
  },
  {
    id: 3,
    name: 'Maggie',
  },
];

const listB = [{
    id: 1,
    count: 30,
  },
  {
    id: 2,
    count: 20,
  },
];

const merge = listA.map(a => ({
  count: 0,
  ...listB.find(b => (b.id === a.id) && b),
  ...a,
}));

console.log(merge);


Either you handle the case where find doesn't find anything :

const listA = [{
    id: 1,
    name: 'Rohit',
  },
  {
    id: 2,
    name: 'Raj',
  },
  {
    id: 3,
    name: 'Maggie',
  },
];

const listB = [{
    id: 1,
    count: 30,
  },
  {
    id: 2,
    count: 20,
  },
];

const merge = listA.map(a => ({
  ...(listB.find(b => (b.id === a.id) && b) || {
    count: 0,
  }),
  ...a,
}));

console.log(merge);

You're almost there

if ...listB.find((b) => (b.id === a.id) && b) is undefined, you can use ...listB.find((b) => (b.id === a.id) && b) || { "count":0 } :

const listA = [
  {"id": 1, "name":"Rohit"},
  {"id": 2, "name":"Raj"},
  {"id": 3, "name":"Maggie"}
]
const listB = [
  {"id": 1, "count": 30},
  {"id": 2, "count": 20}
]
const merge = listA.map(a => ({
  ...listB.find((b) => (b.id === a.id) && b) || { "count":0 }, ...a
}))

console.log(merge)

You can use below utility.

const listA = [
  {"id": 1, "name":"Rohit"},
  {"id": 2, "name":"Raj"},
  {"id": 3, "name":"Maggie"}
]
const listB = [
  {"id": 1, "count": 30},
  {"id": 2, "count": 20}
]

const result = listA.map(objA => {
  const foundObj = listB.find(objB => objB.id === objA.id) || {count: 0}
  return {...objA, ...foundObj}
})

console.log(result)

Hope this helps

A possible solution would be

const listA = [
  {"id": 1, "name":"Rohit"},
  {"id": 2, "name":"Raj"},
  {"id": 3, "name":"Maggie"}
]
const listB = [
  {"id": 1, "count": 30},
  {"id": 2, "count": 20}
]
const merge = listA.map(a => ({
  ...listB.find((b) => (b.id === a.id) && b) || {count: 0 }, ...a
}))

console.log(merge)

Just use a default value for count, if you don't find a matching item in listB;

const mapped = listA.map(({id, name}) => {
  const {count} = {count: 0, ...listB.find(({id: _id}) => id === _id)}
  return {id, name, count}
})

console.log (mapped);
<script>
const listA = [
  {"id": 1, "name":"Rohit"},
  {"id": 2, "name":"Raj"},
  {"id": 3, "name":"Maggie"}
]
const listB = [
  {"id": 1, "count": 30},
  {"id": 2, "count": 20}
]
</script>

Related