Delete property from objects Array in Javascript(6 ways)

JavaScript

In this post, we are going to learn, Delete property from objects Array in Javascript. We have used map(), object.assign(), object.reduce() ,foreach loop to delete property. The for-each loop comes in handy with less and clean code too.

1. Map() to Delete property from objects array in Javascript

In this Javascript program we have map() function that run for each object in array and return array of object with properties Empname and salary.Let us usnderstand with below example.

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

data = Employee.map((Emp) => {
  return {
    Empname : Emp.Empname,
    salary: Emp.salary
  }
});

console.log(data)

Output

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

2. Map() with delete operator to delete property objects array

In this javascript example,The map() function call for each object in the array and one each iteration we have used delete operator to delete Empname property from array of object and return a update object.

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


const updatedEmp = Employee.map(item=>{
  delete item.Empname
  return item
})
console.log(updatedEmp)

Output

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

3. Map with destruction assignment

In this example we have used map() fuction with destructing assignment the map() function run callabck function for each array of object and destructing assigment to unpack object into bunch of varaibles.

Employee.map(({EmpID, salary, …RestEmpdata}) will remove EmpID and Salary from Employee object and return an new object after deleting these properties.

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



const updatedEmp = Employee.map(({EmpID, salary, ...RestEmpdata}) => RestEmpdata)

console.log(updatedEmp);

Output

[
  { Empname: 'John', Dep: 'Admin' },
  { Empname: 'jack', Dep: 'IT' },
  { Empname: 'Racx', Dep: 'IT' },
  { Empname: 'Max', Dep: 'IT' }
]

4.Foreach loop to Delete property from objects Array in JavaScript

In this Javascript Example, we are using a for-each loop to iterate over each array of objects, and on each iteration, the delete operator deletes object property from the 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:3,Dep:'IT'},
    {Empname: 'Max', salary: 70000,EmpID:4,Dep:'IT'} 
  ]

 

//foreach to delete properties from an array of object


Employee.forEach(Emp => {
  delete Emp['Dep'];
});

console.log(Employee);

Output

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

5.Assign() to Delete property from objects array in Javascript

The javascript object.assign() copies enumerat properties one or more source to target source and return the target object.In this Javascript example we are iterating over each object in array of objects and using delete operator to delete EmpId on each iteration and pushing the result into result array.

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

var resObj = [];
Employee.forEach(function(item) { 
    var EmpTempVal = Object.assign({}, item);
    delete EmpTempVal.EmpID; 
    resObj.push(EmpTempVal);
});
console.log(resObj);

Output

[
  { Empname: 'John', salary: 60000, Dep: 'Admin' },
  { Empname: 'jack', salary: 50000, Dep: 'IT' },
  { Empname: 'Racx', salary: 60000, Dep: 'IT' },
  { Empname: 'Max', salary: 70000, Dep: 'IT' }
]

6.reduce() to Delete property from Array of objects in Javascript

In this Javascript example we have used object.reduce() method to delete property form array of object.The 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:3,Dep:'IT'},
    {Empname: 'Max', salary: 70000,EmpID:4,Dep:'IT'}  ]
 
const updatedEmp = Employee.reduce((acc, curr) => {
  const { Empname, salary, ...rest_prop } = curr;
  acc.push(rest_prop);
  return acc;
}, []);

console.log(updatedEmp);

Output

[
  { EmpID: 1, Dep: 'Admin' },
  { EmpID: 2, Dep: 'IT' },
  { EmpID: 3, Dep: 'IT' },
  { EmpID: 4, Dep: 'IT' }
]

Related Posts