如何使用Javascript将具有相同名称的对象分组？

Question

Using Node, I'm implementing a ID3 tag parser to get the title, album, and artist from MP3's.

Now, I need to take the information I've gotten back, and group them by album name.

In my specific usage, I'm trying to go from

This:

[
  { 
    title: 'Break You',
    artist: 'Lamb Of God',
    album: 'Ashes Of The Wake' 
  },
  {
    title: 'An Extra Nail For Your Coffin',
    artist: 'Lamb Of God',
    album: 'Ashes Of The Wake' 
  },
  {
    title: 'Envy And Doubt',
    artist: 'Sever The King',
    album: 'Traitor' 
  },
  {
    title: 'Self Destruct',
    artist: 'Sever The King',
    album: 'Traitor' 
  },
  ...
]

To this: (pseudo code)

[
  'Ashes Of The Wake'{
    {
      title: 'Break You',
      artist: 'Lamb Of God'
    },
    {
      title: 'An Extra Nail For Your Coffin',
      artist: 'Lamb Of God'
    }  
  }
  'Traitor'{
    {
      title: 'Envy and Doubt',
      artist: 'Sever The King'
    },
    {
      title: 'Self Destruct',
      artist: 'Sever The King'
    }
  },
  ...
]

What would be the best way to do this? I'm relatively new to JS, so it may be simple.

Answer 1

Just use Array.prototype.forEach()

The forEach() method executes a provided function once per array element.

 var data = [{ title: 'Break You', artist: 'Lamb Of God', album: 'Ashes Of The Wake' }, { title: 'An Extra Nail For Your Coffin', artist: 'Lamb Of God', album: 'Ashes Of The Wake' }, { title: 'Envy And Doubt', artist: 'Sever The King', album: 'Traitor' }, { title: 'Self Destruct', artist: 'Sever The King', album: 'Traitor' }], grouped = {}; data.forEach(function (a) { grouped[a.album] = grouped[a.album] || []; grouped[a.album].push({ title: a.title, artist: a.artist }); }); document.write('<pre>' + JSON.stringify(grouped, 0, 4) + '</pre>'); 

Answer 2

You can use Array.prototype.reduce

var output = input.reduce(function(result, value) { 
  result[value.album] = result[value.album] || []; 
  result[value.album].push({ title: value.title, artist: value.artist });
  return result; 
}, {});

Answer 3

OBS: 'Ashes Of The Wake' and 'Traitor' should be arrays, not objects, because they have multiple children.

You don't have to, but in case you want to use underscore , as @Daniel said, you can use the groupBy function.

var data = [
  { 
    title: 'Break You',
    artist: 'Lamb Of God',
    album: 'Ashes Of The Wake' 
  },
  {
    title: 'An Extra Nail For Your Coffin',
    artist: 'Lamb Of God',
    album: 'Ashes Of The Wake' 
  },
  {
    title: 'Envy And Doubt',
    artist: 'Sever The King',
    album: 'Traitor' 
  },
  {
    title: 'Self Destruct',
    artist: 'Sever The King',
    album: 'Traitor' 
  }
];
var groupedData = _.groupBy(data, 'album');
console.log(groupedData);

Will output:

[
  'Ashes Of The Wake': [
    {
      title: 'Break You',
      artist: 'Lamb Of God'
    },
    {
      title: 'An Extra Nail For Your Coffin',
      artist: 'Lamb Of God'
    }  
  ],
  'Traitor': [
    {
      title: 'Envy and Doubt,
      artist: 'Sever The King'
    },
    {
      title: 'Self Destruct',
      artist: 'Sever The King'
    }
  ]
]

JSFiddle

Answer 4

As Kieran suggested, using underscore.js provides you an easy elegant solution.

var groupedData = _.groupBy(data, 'album');

Here's the plunker: http://plnkr.co/edit/a7DhxpGx0C4FVMgIjzPY?p=preview

Edit

I would like to add that you would want to use lodash instead of underscore if you are working with Node.js