Blog

To remove a property from all objects in array in JavaScript, you can use any of the following methods –

1. Use the forEach() loop to iterate over all objects in the array and use the delete operator to remove the desired property from each object.
2. Use the map() method to iterate over all objects in the array, create a new object without the desired property and return it.
3. Use the reduce() method to iterate over all objects in the array, create a new object without the desired property and return it.

Let’s have a look at each of these methods in detail below –

Remove A Property From All Objects In Array In JavaScript

1) Using The forEach() Loop

The forEach() loop is used to iterate over an array or an object in JavaScript.

We can use this loop to iterate over all objects in a given array and delete the desired property from each object.

Consider the following example –

var arr = 

   [{ 

    prop1: 1, 

    prop2: 2, 

    prop3: 3, 

  }];

arr.forEach(item => {

   delete item.prop1;

});

console.log(arr); // outputs – { prop2: 2, prop3: 3 }

In the above example, we have an array of objects arr.

We use the forEach() loop to iterate over this array and delete the prop1 property from each object.

Finally, we print the updated array to the console which outputs – [{ prop2: 2, prop3: 3 }].

We only used a single object in the array in the above code. Let’s check the above code with an array containing multiple objects –

var arr = 

[{

  id: 1,  

  name: ‘John’, 

  city: ‘New York’

}, {

  id: 2,  

  name: ‘Mike’, 

  city: ‘Boston’

}];

arr.forEach(item => {

   delete item.id;

});

console.log(arr);

In the above code, we have an array of objects containing information about people. We use the forEach() loop to iterate over this array and delete the id property from each object. Finally, we print the updated array to the console which outputs –

[{

name: ‘John’,

city: ‘New York’

}, {

name: ‘Mike’,

city: ‘Boston’

}]

2) Using The map() Method

The map() method is used to create a new array from an existing one.

This method takes a callback function as an argument which is invoked for each element in the array.

We can use this callback function to delete the desired property from each object and return a new object without that property.

Consider the following example –

var arr = 

   [{ 

    prop1: 1, 

    prop2: 2, 

    prop3: 3, 

}];

newArr = arr.map(item => {

    delete item.prop1;

    return item;

  });

console.log(newArr); // outputs – { prop2: 2, prop3: 3 }

In the above example, we have an array of objects arr.

We use the map() method to iterate over this array and delete the prop1 property from each object.

Then, we return the updated object without that property. Finally, we print the new array to the console which outputs – [{ prop2: 2, prop3: 3 }].

Let’s check the above code with an array containing multiple objects –

var arr = 

  [{ id: 1,  

  name: ‘John’, 

  city: ‘New York’}, 
 {

  id: 2,  

  name: ‘Mike’, 

  city: ‘Boston’

 }];

newArr = arr.map(item => {

    delete item.id;

    return item;

});

console.log(newArr);

In the above code, we have an array of objects containing information about people. We use the map() method to iterate over this array and delete the id property from each object. Then, we return the updated object without that property. Finally, we print the new array to the console which outputs –

[{

name: ‘John’,

city: ‘New York’},

{

name: ‘Mike’,

city: ‘Boston’

}]

3) Using The reduce() Method

The reduce() method is used to apply a function to each element in an array and reduce the array to a single value.

We can use this function to delete the desired property from each object and return a new object without that property.

Consider the following example –

var arr = 

   [{ 

    prop1: 1, 

    prop2: 2, 

    prop3: 3, 

}];

newArr = arr.reduce((acc, curr) => {

    delete curr.prop1;

    acc.push(curr);

    return acc;

}, []);

console.log(newArr); // outputs – { prop2: 2, prop3: 3 }

In the above example, we have an array of objects arr.

We use the reduce() method to iterate over this array and delete the prop1 property from each object.

Then, we push the updated object into a new accumulator array acc and return it. Finally, we print the new array to the console which outputs – [{ prop2: 2, prop3: 3 }].

Let’s check the above code with an array containing multiple objects –

var arr = 

[{ id: 1,  

   name: ‘John’, 

   city: ‘New York’},

{

id: 2,  

name: ‘Mike’, 

city: ‘Boston’

}];

newArr = arr.reduce((acc, curr) => {

    delete curr.id;

    acc.push(curr);

    return acc;

}, []);

console.log(newArr);

In the above code, we have an array of objects containing information about people. We use the reduce() method to iterate over this array and delete the id property from each object. Then, we push the updated object into a new accumulator array acc and return it. Finally, we print the new array to the console which outputs –

[{ name: ‘John’, city: ‘New York’}, { name: ‘Mike’, city: ‘Boston’}]

Conclusion

In this article, we looked at three different ways to remove a property from all objects in array in JavaScript.

You can choose any of these methods based on your requirements.

I hope this article was helpful and that you now have a better understanding of how to remove a property from all objects in array in JavaScript.