Get an array of property values ​​from an array of objects using jquery

Question

I'm trying to get from here:

example = [{ name: "someone1", city: "somewhere1", state: "someplace1" },{ name: "someone2", city: "somewhere2", state: "someplace2" }] 

here:

 example.name = [ "someone1", "someone2" ] 

As little code as possible. Obviously, I could just loop it and build an array, but I need to do this many times on different objects. I could write a function to do this, but it would be difficult to make a function common enough for my application.

Is there a shortcut for this in jQuery?

Answer 1

You can iterate over the keys of the objects and save the name in the array using push :

 example = [{ name: "someone1", city: "somewhere1", state: "someplace1" }, { name: "someone2", city: "somewhere2", state: "someplace2" }]; var arrNames = []; //iterate through object keys Object.keys(example).forEach(function(key) { //get the value of name var val = example[key]["name"]; //push the name string in the array arrNames.push(val); }); console.log(arrNames);//prints ["someone1", "someone2"] 

After the @Felix suggestion (with which I agree) there is no need to use Object.keys :

 example = [{ name: "someone1", city: "somewhere1", state: "someplace1" }, { name: "someone2", city: "somewhere2", state: "someplace2" }]; var arrNames = []; //iterate through object keys example.forEach(function(item) { //get the value of name var val = item.name //push the name string in the array arrNames.push(val); }); console.log(arrNames); //prints ["someone1", "someone2"] 

References

Object.keys ()

Array.prototype.forEach ()

Array.prototype.push ()

Answer 2

I quickly checked you here: http://jsperf.com/jquery-vs-javascriptlvjsklvjsfklsfklsdjfk

It consists of three solutions:

Basic for cycle

 for (var i = 0; i < example.length; i++) { array.push(example[i].name); } 

A jQuery $ .each ()

 $.each(example, function(i, item) { array.push(example[i].name); }); 

And one answer is sent to this thread

 Object.keys(example).forEach(function(key) { //get the value of name var val = example[key]["name"]; //push the name string in the array array.push(val); }); 

Here are the results (better is better)

Basically, you should keep in mind that jQuery may have a shortcut that consists of “less code,” but in fact it will have worse performance than if you yourself wrote the code.

Answer 3

You can use the $.map function from jQuery:

 var value = $.map(example, function () { return this.name; }); 

This will return an array of elements.

Answer 4

Here's how to do it using jinqJs

Line of code:

 jinqJs().from(example).select(function(row){return row.name;}); 

 var example = [{ name: "someone1", city: "somewhere1", state: "someplace1" },{ name: "someone2", city: "somewhere2", state: "someplace2" }]; var result = jinqJs().from(example).select(function(row){return row.name;}); document.body.innerHTML = '<pre>' + JSON.stringify(result, null, 2) + '</pre><br><br>'; 

 <script src="https://rawgit.com/fordth/jinqJs/master/jinqjs.min.js"></script> 

Answer 5

This is the simplest solution I can think of:

 function doThat (myArray) { newObject = {}; myArray.forEach(function (obj, idx) { var keys = Object.keys(obj); keys.forEach(function (key) { if (!obj[key]) { newObject[key] = []; } newObject[key][idx] = obj[key]; }); }); return newObject; }