CODEWITHSUNDEEP
javascriptarrays
marcuspetty
marcuspetty

Reputation: 311

How to take a code from one array and lookup a value from another array and return the new value

I have an array of data which supplies a code - I get this data from an API call. With this code, I need to lookup a value which I get from another array and API call.
I then need to return this new value.
I initially had a switch statement which I hard coded - but this is not scalable as the return values will change. I'm basically mapping the original array and then within this map, I need to loop through the other array and return the new value.

  const data = 
[{name: "youtube",  type: "v"},{name: "photo", type: "i"}]

const codes = [{code:"v", description:"video"},{code:"i", description:"image"}]

So I need to do something like this but this does not work, it only works for one value

data.map((item, index) => {
  const newList = codes.reduce((pre, curr) => {
    if (curr.code === item.type) {
      return curr
    }
  })
  return { ...item, ...item.type = newList.description }
})

So expected result of the new array would be

[{name: "youtube",  type: "video"},{name: "photo", type: "image"}]

Upvotes: 1

Views: 129

Answers (3)

Andy
Andy

Reputation: 63524

Use find instead of reduce here:

const data = [{name: "youtube",  type: "v"},{name: "photo", type: "i"}];
const codes = [{code:'v', description:'video'},{code:'i', description:'image'}];

// `map` over data destructing the type (and all the other properties)
const out = data.map(({ type, ...rest }) => {

  // Destructure the description from the
  // matching object in the codes array
  const { description } = codes.find(obj => obj.code === type);

  // Return the new object
  return { ...rest, type: description };
});

console.log(out);

Upvotes: 1

Apoorv
Apoorv

Reputation: 620

You could also use the below code to achieve the desired result

var data = [{name: "youtube",  type: "v"},{name: "photo", type: "i"}]

var codes = [{code:"v", description:"video"},{code:"i", 
description:"image"}]
/*Create a Map of the codes and what it means basically convert the codes 
array to a key,value map*/

var codeMap = {};

codes.map(item => {
 codeMap[item['code']] = item['description']
})

var finalResult = []

data.map(item => {
finalResult.push({name:item.name,type:codeMap[item.type]})
})
console.log(finalResult)

Upvotes: 0

adiga
adiga

Reputation: 35222

You could do something like this using map and find

const data = [{name: "youtube",  type: "v"},{name: "photo", type: "i"}]
const codes = [{code:"v", description:"video"},{code:"i", description:"image"}]

const newData = data.map(item => {
  const code = codes.find(b => b.code === item.type);
  return { ...item, type: code.description }
})

console.log(newData)

You could also create a mapping object for code and type using reduce. 

{
  "v": "video",
  "i": "image"
}

And then use codeMap[d.type] inside map to get the description. This way you can avoid repeatedly getting the same data using find

const data = [{name: "youtube",  type: "v"},{name: "photo", type: "i"}]
const codes = [{code:"v", description:"video"},{code:"i", description:"image"}]

const codeMap = codes.reduce((acc, c) => (acc[c.code] = c.description, acc), {})
const newData = data.map(d => ({ ...d, type: codeMap[d.type] }))

console.log(codeMap)
console.log(newData)

Upvotes: 1

Related Questions