How to Clear an Object in JavaScript

Clear an Object in JavaScript #

To clear an object and delete all its properties use a for..in loop. The loop will iterate over all the enumerable properties of the object. In each iteration use the delete operator to delete each property.

Copied!
const obj = {a: 'one', b: 'two'};

for (const key in obj) {
  delete obj[key];
}

console.log(obj); // 👉️ {}

The for...in loop iterates over all of an object enumerable properties.

An enumerable property is one that we added on the object using simple assignment, e.g. . or [] assignment.

Properties assigned on the object using the Object.definedProperty method are non-enumerable by default and not iterated over in a for...in loop.

The Object.defineProperty method is mostly used by 3rd party library creators and not in day-to-day code so chances are the for...in loop covers all of your object's properties.

Copied!
let obj = {a: 'one', b: 'two'};

obj = {};

console.log(obj); // 👉️ {}

Notice that we used the let keyword when declaring the obj variable. The let keyword allows us to reassign the variable in our code as opposed to variables using the const keyword, which cannot be reassigned.

In the extremely unlikely scenario that your object contains non-enumerable properties, you can use the following approach to clear an object.

Copied!
let obj = {a: 'one', b: 'two'};

Object.defineProperty(obj, 'color', {
  value: 'red',
  enumerable: false, // 👈️ defaults to false
  configurable: true,
});

const allProperties = Object.getOwnPropertyNames(obj);
console.log(allProperties); // 👉️ ['a', 'b', 'color']

allProperties.forEach(property => {
  delete obj[property];
});

console.log(Object.getOwnPropertyNames(obj)); // []

In the code snippet we use the Object.getOwnPropertyNames method to get an array the enumerable and non-enumerable properties of the object.

We then use the Array.forEach method to iterate over all elements in the array and clear each property using the delete operator.