Open In App
Related Articles

How to remove a key from JavaScript object ?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Report issue
Report

A JavaScript object is a combination of keys and values. We will be given an object and we need to delete one of the keys from that object using various methods and print the result into the console using JavaScript.

remove-a-key-from-javascript-obj

How to remove a key from JavaScript object ?

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

Using the reduce() and filter() methods

The reduce() and the filter() methods of JavaScript can together be used to remove a key from an JavaScript object.

Syntax:

Object.keys(object_name).filter(()=>{}).reduce(()=>{});

Example: The below code example implements the filter and reduce methods together to remove key from an object.

Javascript

let details = {
    name: 'Alex',
    age: 30,
    country: 'Canada'
};
 
console.log('Original Object: ', details);
details = Object.keys(details).filter(objKey =>
    objKey !== 'age').reduce((newObj, key) =>
    {
        newObj[key] = details[key];
        return newObj;
    }, {}
);
console.log(details);

                    

Output
Original Object:  { name: 'Alex', age: 30, country: 'Canada' }
{ name: 'Alex', country: 'Canada' }

Using the delete operator

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

Syntax:

delete objectName.propertyName;

Example: The below code removes the ‘age’ key from the object, leaving only the ‘name’ and ‘country’ keys in the object.

Javascript

const details = {
    name: 'Alex',
    age: 30,
    country: 'Canada'
};
 
console.log('Original Object:', details);
delete details.age;
console.log('Object after deleting age key:', details);

                    

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

Using destructuring with the rest operator

Destructuring an object using 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: The below code uses the destructuring syntax to remove keys from an obect in JavaScript.

Javascript

const details = {
    name: 'Alex',
    age: 30,
    country: 'Canada'
};
console.log('orignal object', details)
// after using destructuring and rest operator
const { age, ...rest } = details;
console.log(rest);

                    

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

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: The below code implements the Object.assign() method to remove property from an object.

Javascript

const details = {
    name: 'Alex',
    age: 30,
    country: 'Canada'
};
 
console.log('orignal object', details)
const { age, ...rest } = Object.assign({}, details);
console.log(rest);

                    

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

Using Object.fromEntries() and Object.entries()

The Object.entries() will be used 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. Finally, we use Object.fromEntries() to convert the filtered array back into an object.

Example: The below code implements the above methods to remove key from an object in JavaScript.

Javascript

const details = {
    name: 'Alex',
    age: 30,
    country: 'Canada'
};
const { age, ...rest } = Object.fromEntries(
    Object.entries(details).filter(([key]) =>
        key !== 'age'));
console.log(rest);

                    

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

Using the _.omit method of Underscore.js library

The underscore.js is an JavaScript library that can be included in an HTML document through its CDN Link and then you are allowed to use its inbuilt functions.

Syntax:

objName = _.omit(objName, 'ketToRemove');

Example: The below code will explain the use of the _.omit() function to remove a key from JavaScript object.

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
"width=device-width, initial-scale=1.0">
    <title>
        Remove key from JavaScript Object
    </title>
</head>
 
<body>
    <script src=
            integrity=
"sha512-2V49R8ndaagCOnwmj8QnbT1Gz/rie17UouD9Re5WxbzRVUGoftCu5IuqqtAM9+UC3fwfHCSJR1hkzNQh/2wdtg=="
            crossorigin="anonymous"
            referrerpolicy="no-referrer">
        </script>
        <script>
            let details = {
                name: 'Alex',
                age: 30,
                country: 'Canada'
            };
            console.log("Object before removal: ", details);
            details = _.omit(details, 'age');
            console.log("Object after removal: ", details);
        </script>
</body>
 
</html>

                    

Output:

output



Last Updated : 18 Jan, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads