How to remove a key from JavaScript object ?

To remove a key from a JavaScript object, we can use the delete operator. This delete operator allows to remove a property from an object and its value.

There are several methods that can be used to remove a key from a JavaScript object

• Using the delete operator
• Using destructuring and rest operator
• Using Object.assign()
• Using Object.fromEntries() and Object.entries()

We will explore all the above methods along with their basic implementation with the help of examples.

Approach 1: Using the delete operator

The delete operator in JavaScript is used to remove a property (key-value pair) from an object.

Syntax:

delete objectName.propertyName;

Example: In this example, the delete keyword is used to remove the ‘age’ key from the details object, leaving only the ‘name’ and ‘country’ keys in the object.

Original Object: { name: 'Alex', age: 30, country: 'Canada' }
Object after deleting age key: { name: 'Alex', country: 'Canada' }

Approach 2: Using destructuring and rest operator

Destructuring with the rest operator creates a new object without a specified property, keeping the remaining properties from the original object.

Syntax:

const { propertyToRemove, ...rest } = objectName;

Example: In this example, the property age is removed from the details object, and the remaining properties are stored in the rest object using destructuring with the rest operator.

orignal object { name: 'Alex', age: 30, country: 'Canada' }
{ name: 'Alex', country: 'Canada' }

Approach 3: Using Object.assign()

Using Object.assign() allows you to create a new object without a specified property by copying all properties except the one you want to remove.

Syntax:

const { age, ...rest } = Object.assign({}, details);

Example: In this example, Object.assign() is used to create a shallow copy of the details object without the age property. The remaining properties are stored in the rest object using destructuring with the rest operator.

orignal object { name: 'Alex', age: 30, country: 'Canada' }
{ name: 'Alex', country: 'Canada' }

Approach 4: Using Object.fromEntries() and Object.entries()

In this approach, we use Object.entries() to convert the object into an array of key-value pairs. Then, we use Array.filter() to exclude the key-value pair with the specified key (in this case, ‘age’). Finally, we use Object.fromEntries() to convert the filtered array back into an object.

Syntax:

Example: In this example The ‘age’ key from the details object is filtered out using Object.fromEntries() and destructuring, resulting in the rest object.

{ name: 'Alex', country: 'Canada' }