How do I convert a javascript object array to a string array of the object attribute I want?

Javascript

Javascript Problem Overview


> Possible Duplicate:
> Accessing properties of an array of objects

Given:

[{    'id':1,    'name':'john'},{    'id':2,    'name':'jane'}........,{    'id':2000,    'name':'zack'}]

What's the best way to get:

['john', 'jane', ...... 'zack']

Must I loop through and push item.name to another array, or is there a simple function to do it?

Javascript Solutions


Solution 1 - Javascript

If your array of objects is items, you can do:

var items = [{
  id: 1,
  name: 'john'
}, {
  id: 2,
  name: 'jane'
}, {
  id: 2000,
  name: 'zack'
}];

var names = items.map(function(item) {
  return item['name'];
});

console.log(names);
console.log(items);

Documentation: map()

Solution 2 - Javascript

Use the map() function native on JavaScript arrays:

var yourArray = [ {
    'id':1,
    'name':'john'
},{
    'id':2,
    'name':'jane'
}........,{
    'id':2000,
    'name':'zack'
}];

var newArray = yourArray.map( function( el ){ 
                                return el.name; 
                               });

Solution 3 - Javascript

You can do this to only monitor own properties of the object:

var arr = [];

for (var key in p) {
	if (p.hasOwnProperty(key)) {
		arr.push(p[key]);
	}
}

Solution 4 - Javascript

You can use this function:

function createStringArray(arr, prop) {
   var result = [];
   for (var i = 0; i < arr.length; i += 1) {
      result.push(arr[i][prop]);
   }
   return result;
}

Just pass the array of objects and the property you need. The script above will work even in old EcmaScript implementations.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPK.View Question on Stackoverflow
Solution 1 - JavascripttechfoobarView Answer on Stackoverflow
Solution 2 - JavascriptSirkoView Answer on Stackoverflow
Solution 3 - JavascriptlooperView Answer on Stackoverflow
Solution 4 - JavascriptMinko GechevView Answer on Stackoverflow