How to add data from array of object with array inside to another array of object? javascript

Question

This is my code, I want to create another filtered array like the example below, I have 2 arrays and want to add score information to it, I know it's simple but can't find the solution

  const wishesData = [
    {
       name: "Peter",
      presents: ["coffee", "holidays"]
    },
    {
       name: "Mario",
      presents: ["coffee", "videogames"]
    },
    {
       name: "Amanda",
      presents: ["computer", "tattoo"]
    }
  ]
  const scoresData= [
    {
      name: "Peter",
      score: 10
    },
    {
      name: "Mario",
      score: 2.3
    },
    {
       name: "Amanda",
      score: 1.1
    }
  ]
  const result = wishesData.map((ele) => {
      return {
               ...ele,
              score:  scoresData.find(s=> s.name === ele.name? s.score: 0)
                  }
  })
           console.log("este es el resultado=>",result)

I want to modify the array wishesData adding "score" to all objects inside and get to look like this example:

{
  name: "Mario",
  presents: ["coffee", "videogames"],
  score: 2.3
}

Answer 1

Please check the example and correction and suggestions.

• Correction: scoresData.find(s=> s.name === ele.name? s.score: 0) - here you do not close bracket for Array.find and try to access it's property within find . In your code, you will get scoreData object instead of score .

const match = scoresData.find(s=> s.name === ele.name); // -> ? s.score: 0)
return match ? match.score : 0;

// or simply
const score = scoresData.find(s=> s.name === ele.name)?.score || 0;

• Suggestion: it will take O(N^2) time. All iteration for wishesData need another iteration scoresData for each. Why don't you use reduce provided in example?

const scoreMap = scoresData.reduce((a, c) => ({
    ...a,
    [c.name]: c.score
}), {})

// you can easy to find score by
const result = wishesData.map((ele) => {
    return {
        ...ele,
        score: scoreMap[ele.name] || 0,
    }
})

Thanks

 const wishesData = [{ name: "Peter", presents: ["coffee", "holidays"] }, { name: "Mario", presents: ["coffee", "videogames"] }, { name: "Amanda", presents: ["computer", "tattoo"] } ] const scoresData = [{ name: "Peter", score: 10 }, { name: "Mario", score: 2.3 }, { name: "Amanda", score: 1.1 } ] const scoreMap = scoresData.reduce((a, c) => ({...a, [c.name]: c.score }), {}) const result = wishesData.map((ele) => { return {...ele, score: scoreMap[ele.name] || 0, } }) console.log("este es el resultado=>", result)

And this is just editing of your origin code

 const wishesData = [{ name: "Peter", presents: ["coffee", "holidays"] }, { name: "Mario", presents: ["coffee", "videogames"] }, { name: "Amanda", presents: ["computer", "tattoo"] } ] const scoresData = [{ name: "Peter", score: 10 }, { name: "Mario", score: 2.3 }, { name: "Amanda", score: 1.1 } ] const result = wishesData.map((ele) => { return {...ele, score: scoresData.find(s => s.name === ele.name)?.score || 0 } }) console.log("este es el resultado=>", result)

Answer 2

You return the whole object, just return the score:

 const wishesData = [{ name: "Peter", presents: ["coffee", "holidays"] }, { name: "Mario", presents: ["coffee", "videogames"] }, { name: "Amanda", presents: ["computer", "tattoo"] }, { name: "Another", presents: ["computer", "tattoo"] } ] const scoresData = [{ name: "Peter", score: 10 }, { name: "Mario", score: 2.3 }, { name: "Amanda", score: 1.1 } ] const result = wishesData.map(ele => { const match = scoresData.find(s => s.name === ele.name) return {...ele, score: match? match.score: 0 } }) console.log("este es el resultado=>", result)

Answer 3

const wishesWithScores = wishesData.map(wishObject => {
  const descriptor = wishObject.name;
  const { score } = scoresData.find(({ name }) => name === descriptor);

  return {
    ...wishObject,
    score
  }
});