Map multiple properties from array of objects JavaScript

JavaScript

In this post, we are going to learn how to Map multiple properties from an array of objects in JavaScript with examples using the array.map() function.Sometimes working with an array of objects in Javascript we need to select one, multiple properties, or even all properties in an array object.

1. Map multiple properties from array of objects JavaScript

The array.map() method is iterated over the element of the array and modifies elements of the array by applying some operation and returning the modified element as a new array. In this JavaScript Program, we have used array.map() to select and create an array of Empname, Salary, and EmpID properties from an array of objects. This is how we use an array.map() to select one or more properties from an array of objects.

let Employee = [
    {Empname: 'John', salary: 60000,EmpID:1,Dep:'Admin'},
    {Empname: 'jack', salary: 50000,EmpID:2,Dep:'IT'},
    {Empname: 'Racx', salary: 60000,EmpID:4,Dep:'IT'}
   
   
 
  ]
 


result = Employee.map(({Empname, salary,EmpID,Dep})=>{ 

    return {Empname, salary,EmpID};

});

Output

[
  { Empname: 'John', salary: 60000, EmpID: 1 },
  { Empname: 'jack', salary: 50000, EmpID: 2 },
  { Empname: 'Racx', salary: 60000, EmpID: 4 }
]

2. Map multiple properties array of objects JavaScript

To map multiple properties from an array of objects in javascript, We have used destructing assignment and exclude the properties ‘EmpName’ and rest operator to include the properties we want to have map an array of objects by using an array.map() function.

let Employee = [
    {Empname: 'John', salary: 60000,EmpID:1,Dep:'Admin'},
    {Empname: 'jack', salary: 50000,EmpID:2,Dep:'IT'},
    {Empname: 'Racx', salary: 60000,EmpID:4,Dep:'IT'}
   
   
 
  ]


const EmployeeData = Employee.map(({ Empname, ...restProps }) => restProps);
console.log(EmployeeData);

Output

[
  { salary: 60000, EmpID: 1, Dep: 'Admin' },
  { salary: 50000, EmpID: 2, Dep: 'IT' },
  { salary: 60000, EmpID: 4, Dep: 'IT' }
]

3. Map multiple properties from array of objects JavaScript

In this JavaScript example, we have used array.map() to map multiple properties. The array.map() function will return a new array of properties we have specified Empname:emp.Empname, salary: emp.salary,EmpID:emp.EmpID .We can specify the key as per need.

let Employee = [
    {Empname: 'John', salary: 60000,EmpID:1,Dep:'Admin'},
    {Empname: 'jack', salary: 50000,EmpID:2,Dep:'IT'},
    {Empname: 'Racx', salary: 60000,EmpID:4,Dep:'IT'}    ]

let EmployeeData = Employee.map(emp => {
   return { Empname:emp.Empname, salary: emp.salary,EmpID:emp.EmpID };
})        

console.log(EmployeeData);

Output

[
  { Empname: 'John', salary: 60000, EmpID: 1 },
  { Empname: 'jack', salary: 50000, EmpID: 2 },
  { Empname: 'Racx', salary: 60000, EmpID: 4 }
]

4. Function to Map multiple properties from array of objects JavaScript

In this Javascript program Example,We have defined a custom function that takes an array of object and property, one or multiple that we want to map from the array of object and reduce() method, The array.reduce() method call a callback function for each element of the array and the result returned by the callback function after each iteration pass to the accumulator of reduce function that is used for the next iteration.

let Employee = [
    {Empname: 'John', salary: 60000,EmpID:1,Dep:'Admin'},
    {Empname: 'jack', salary: 50000,EmpID:2,Dep:'IT'},
    {Empname: 'Racx', salary: 60000,EmpID:4,Dep:'IT'}
   
   
 
  ]


function MapMultiProps(arrObj, properties){
  return arrObj.map((obj)=> Object.keys(obj).reduce((acc,key)=>{
    if(properties.has(key))    
      acc[key] = obj[key];  
    return acc;
  },{}));
}
let keys  = new Set(["Empname","salary"]);
let resultObj = MapMultiProps(Employee, keys);
console.log(resultObj);

Output

[
  { Empname: 'John', salary: 60000 },
  { Empname: 'jack', salary: 50000 },
  { Empname: 'Racx', salary: 60000 }
]

Summary

In this post, we have learned, how to Map multiple properties from an array of objects JavaScript with examples.

Related Posts