Check if key exists in another array and get value from it and push to other array

Question

I have these two arrays, I want to check if the titles and keys match and then push the count from typesCount into types.

I have tried to do a map within a map to check the values against each other and produce a new array but it has not worked.

const types = [
  {
    title: 'House',
    slug: 'house',
    count: 0,
  },
  {
    title: 'Car',
    slug: 'car',
    count: 0,
  },
  {
    title: 'Bike',
    slug 'bike',
    count: 0,
  },
];

const typesCount = [
  {
    key: 'House',
    count: '11',
  },
  {
    key: 'Bike',
    count: '22',
  },
];

What I've tried so far

const checkForCount = typesCount.map( x => ({
  types.map( y => ({
     title: y.title,
     slug: y.slug,
     count: y.title === x.key : x.count ? y.count,
   }));
}));

Nithish · Accepted Answer · 2020-07-05 04:41:12Z

This can be done by using map and find like below

const types = [{title:'House',slug:'house',count:0,},{title:'Car',slug:'car',count:0,},{title:'Bike',slug:'bike',count:0,},];

const typesCount = [{key:'House',count:'11',},{key:'Bike',count:'22',},];

//Loop through the actual array 
const res = types.map(type => ({
  ...type,
  //find if the object is present in counts array else use `{}`
  count:(typesCount.find(tCount => tCount.key === type.title) || {}).count || type.count
}))

console.log(res)

This can also be done in another way by using reduce and map like below

const types = [{title:'House',slug:'house',count:0,},{title:'Car',slug:'car',count:0,},{title:'Bike',slug:'bike',count:0,},];

const typesCount = [{key:'House',count:'11',},{key:'Bike',count:'22',},];

//use reduce to format the counts like {House:"11",Bike:"22"}. This will be used while updateing the counts in the actual data
const formattedCounts = typesCount.reduce((res, obj) => {
  res[obj.key] = obj.count;
  return res
}, {})


const result = types.map(type => ({
  ...type,
  //getting the count from formattedCounts object
  count: formattedCounts[type.title] || type.count
}))

console.log(result)

Hope this helps.

Mario · Accepted Answer · 2020-07-05 04:26:08Z

1

Please try the following solution

const types = [
  {
    title: "House",
    slug: "house",
    count: 0,
  },
  {
    title: "Car",
    slug: "car",
    count: 0,
  },
  {
    title: "Bike",
    slug: "bike",
    count: 0,
  },
];

const typesCount = [
  {
    key: "House",
    count: "11",
  },
  {
    key: "Bike",
    count: "22",
  },
];

const output = types.reduce((previousValue, currentValue) => {
  const entry = typesCount.find(({ key }) => key === currentValue.title);

  if (entry) {
    currentValue = { ...currentValue, count: entry.count };
  }

  previousValue = [...previousValue, currentValue];

  return previousValue;
}, []);

console.log(output);

See

Array.prototype.reduce()

answered Jul 5, 2020 at 4:26

Mario

5,0044 gold badges42 silver badges65 bronze badges

Comments

Nick Parsons · Accepted Answer · 2020-07-05 04:26:24Z

1

You can make a Map of keys and counts from your typesCount, which looks something like so:

{
  House => 11,
  Bike => 22
}

You can then use .map() on your types array, where, for each object, you use the spread syntax to spread the object properties into a new object literal. You can then update the count property to be one from the map you made if it exists, if it doesn't you can default the value to the current count value of the current object.

See example below:

const types = [ { title: 'House', slug: 'house', count: 0, }, { title: 'Car', slug: 'car', count: 0, }, { title: 'Bike', slug: 'bike', count: 0, }, ]; 
const typesCount = [ { key: 'House', count: '11', }, { key: 'Bike', count: '22', }, ];

const counts = new Map(typesCount.map(({key, count}) => [key, count]));
const res = types.map(o => ({...o, count: counts.get(o.title) || o.count}));
console.log(res);

answered Jul 5, 2020 at 4:26

Nick Parsons

51.7k6 gold badges62 silver badges80 bronze badges

4 Comments

Mario Over a year ago

Elegant solution. A different approach

UXCODA Over a year ago

Im actually thinking this is better now because get has full support whereas find has no IE11 support.

Nick Parsons Over a year ago

@UXCODA If you want IE11 support then all of the current answers won't work due to the spread syntax. You'd need to write your own logic to merge two objects, or use Object.assign() and its polyfill

UXCODA Over a year ago

Thanks I suspect our system might have a polyfill but useful just in case. Cheers

Collectives™ on Stack Overflow

Check if key exists in another array and get value from it and push to other array

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related