How to minimize an object and build an array from an array of objects in JavaScript

Question

I have an array of objects and each object has around 5 properties and respective values. I would like to iterate through each object in the array and pick only two properties from it and rebuild the object and the array.

For example:

let resArray = [
{"name": "Aaron", "id": 123, "sex": "male", "country": "usa"}, 
{"name": "Bert", "id": 456, "sex": "male", "country": "usa"}, 
{"name": "Brenda", "id": 657, "sex": "female", "country": "canada"}, 
{"name": "Chris", "id": 856, "sex": "male", "country": "usa"}, 
{"name": "Angela", "id": 113, "sex": "female", "country": "columbia"}, 
{"name": "Maria", "id": 569, "sex": "female", "country": "mexico"}];

I want to remove the "country" and the "sex" properties from the objects and retain the "name" and "id" properties and rebuild the array. i.e., the output should be as follows:

let outArray = [
{"name": "Aaron", "id": 123}, 
{"name": "Bert", "id": 456}, 
{"name": "Brenda", "id": 657}, 
{"name": "Chris", "id": 856}, 
{"name": "Angela", "id": 113}, 
{"name": "Maria", "id": 569}];

As of now, I am just using the resArray and iterating through the whole array and getting whatever values I want. But I just think I can minimize the object so that it will be clear of the clutter.

Could anyone help me out with it? Thank you.

score 5 · Accepted Answer · answered Dec 05 '17 at 06:46

You can use array#map along with object#destructuring. Iterate through your object using array#map and get the name and id value and create a new object.

let resArray = [ {"name": "Aaron", "id": 123, "sex": "male", "country": "usa"}, {"name": "Bert", "id": 456, "sex": "male", "country": "usa"}, {"name": "Brenda", "id": 657, "sex": "female", "country": "canada"}, {"name": "Chris", "id": 856, "sex": "male","country": "usa"}, {"name": "Angela", "id": 113, "sex": "female", "country": "columbia"}, {"name": "Maria", "id": 569, "sex": "female", "country": "mexico"}];
let result = resArray.map(({name, id}) => ({name, id}));
console.log(result);

Thank you :) Really helpful. – Angela Roux Dec 05 '17 at 07:02 — Angela Roux, Dec 05 '17 at 07:02

score 1 · Answer 2 · answered Dec 05 '17 at 06:45

Use Array#map function and create your desired shape based on the item

let resArray = [
   {"name": "Aaron", "id": 123, "sex": "male", "country": "usa"}, 
   {"name": "Bert", "id": 456, "sex": "male", "country": "usa"}, 
   {"name": "Brenda", "id": 657, "sex": "female", "country": "canada"}, 
   {"name": "Chris", "id": 856, "sex": "male", "country": "usa"}, 
   {"name": "Angela", "id": 113, "sex": "female", "country": "columbia"}, 
   {"name": "Maria", "id": 569, "sex": "female", "country": "mexico"}
];

let mappedArr = resArray.map(item => ({name: item.name, id: item.id}));

console.log(mappedArr);

Also you can destruct your parameter item inside the parameters list and get only the desired results

let mappedArr = resArray.map(({id, name}) => ({name, id}));

score 0 · Answer 3 · answered Dec 05 '17 at 06:53

You can simply use .map() as following -

let resArray = [
   {"name": "Aaron", "id": 123, "sex": "male", "country": "usa"}, 
   {"name": "Bert", "id": 456, "sex": "male", "country": "usa"}, 
   {"name": "Brenda", "id": 657, "sex": "female", "country": "canada"}, 
   {"name": "Chris", "id": 856, "sex": "male", "country": "usa"}, 
   {"name": "Angela", "id": 113, "sex": "female", "country": "columbia"}, 
   {"name": "Maria", "id": 569, "sex": "female", "country": "mexico"}
];

let outArray = resArray.map(item => ({name: item.name, id: item.id}));

console.log(JSON.stringify(outArray));

How to minimize an object and build an array from an array of objects in JavaScript

3 Answers3