Question 412029 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Use a mapping function to map one property to another object

I have an array of objects as per below.

songs = [
  { 
    track_name: "name of track" , 
    track_genres: ["chamber pop","indie pop"] },
  { 
    track_name: "name of track 2" , 
    track_genres: ["dutch r&b","indie soul", "indie pop"] },
  { 
    track_name: "name of track 3" , 
    track_genres: ["indie pop","chamber pop","indie soul"] }
]

I have another mapping object that looks like this

genres = [
  {
    name: "Pop",
    children: [{name:"chamber pop"},{name:"indie pop"}]
  },
  {
    name: "R&B",
    children: [{name:"dutch r&b"}]
  },
  {
    name: "Soul",
    children: [{name:"indie soul"}]
  }
]

What I want to do is for each track, go through the track genres, and use the "genres" variable to assign the parent genres for each track. Parent genre ideally shouldn’t be repeated.

Expected Output:

const songs = [ 
{ 
  track_name: "name of track", 
  track_genres: ["chamber pop", "indie pop"], 
  parent_genres: ["Pop"] }, 
{ 
  track_name: "name of track 2", 
  track_genres: ["dutch r&b", "indie soul", "indie pop"], 
  parent_genres: ["R&B","Soul","Pop"] }, 
{ 
  track_name: "name of track 3", 
  track_genres: ["indie pop", "chamber pop", "indie soul"], 
  parent_genres: ["Pop", "Soul"] }
];
Tags:

2

Answers


  1. 0 
    songs = [
  { 
    track_name: "name of track" , 
    track_genres: ["chamber pop","indie pop"] },
  { 
    track_name: "name of track 2" , 
    track_genres: ["dutch r&b","indie soul", "indie pop"] },
  { 
    track_name: "name of track 3" , 
    track_genres: ["indie pop","chamber pop","indie soul"] }
]

genres = [
  {
    name: "Pop",
    children: [{name:"chamber pop"},{name:"indie pop"}]
  },
  {
    name: "R&B",
    children: [{name:"dutch r&b"}]
  },
  {
    name: "Soul",
    children: [{name:"indie soul"}]
  }
]

const getParentGenres = (trackGenres) => {
  const parentGenres = new Set(); 
  trackGenres.forEach(trackGenre => {
    genres.forEach(genre => {
      if (genre.children.some(child => child.name === trackGenre)) {
        parentGenres.add(genre.name); 
      }
    });
  });

  return Array.from(parentGenres); 
};


const updatedSongs = songs.map(song => ({
  ...song,
  parent_genres: getParentGenres(song.track_genres)
}));

console.log(updatedSongs);
    Login or Signup to reply.
  2. 0

    I’d first transform your genres array into a Map which maps the children to the genre name:

    {'chamber pop' => 'Pop', 'indie pop' => 'Pop', 'dutch r&b' => 'R&B', 'indie soul' => 'Soul'}

    this can be done by flatMap-ing your genres array and then for each child object return a key-value pair that includes the genre-name as the value and the child name as the key:

    new Map(genres.flatMap(genre => genre.children.map((child) => [child.name, genre.name])));

    Once you have that map built, you can map through songs and add your parent_genres property and set it to an array. This array is a mapped version of your track_genres where you used the above Map to get the associated genre for each item. Then you can wrap this in a Set and spread the result back into array to remove any duplicates:

    const genres = [ { name: "Pop", children: [{name:"chamber pop"},{name:"indie pop"}] }, { name: "R&B", children: [{name:"dutch r&b"}] }, { name: "Soul", children: [{name:"indie soul"}] } ];
const songs = [ { track_name: "name of track" , track_genres: ["chamber pop","indie pop"] }, { track_name: "name of track 2" , track_genres: ["dutch r&b","indie soul", "indie pop"] }, { track_name: "name of track 3" , track_genres: ["indie pop","chamber pop","indie soul"] } ];

const genreMap = new Map(genres.flatMap(genre => genre.children.map(child => [child.name, genre.name])));
const result = songs.map(song => ({
  ...song,
  parent_genres: [...new Set(song.track_genres.map(genre => genreMap.get(genre)))]
}));

console.log(result);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search