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
}

Alona · Accepted Answer · 2021-01-07 17:41:37Z

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)

Anurag Srivastava · Accepted Answer · 2021-01-07 17:19:28Z

1

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)

answered Jan 7, 2021 at 17:19

Anurag Srivastava

14.5k4 gold badges39 silver badges47 bronze badges

Comments

James Jr. · Accepted Answer · 2021-01-07 17:24:58Z

0

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

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

answered Jan 7, 2021 at 17:24

James Jr.

1837 bronze badges

2 Comments

Anurag Srivastava Over a year ago

A small explanation of what this does would be helpful

double-beep Over a year ago

While this code may solve the question, including an explanation of how and why this solves the problem would really help to improve the quality of your post, and probably result in more up-votes. Remember that you are answering the question for readers in the future, not just the person asking now. Please edit your answer to add explanations and give an indication of what limitations and assumptions apply. From Review

Collectives™ on Stack Overflow

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

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related