There are several ways to clone a JavaScript object except for one key. The easiest way is to use Object.assign()
method to clone an object and then delete the desired key.
For example:
const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const clone = Object.assign({}, originalObject); delete clone.key2; console.log(clone); // { key1: 'value1', key3: 'value3' }
This guide shows you 4 different ways to clone a JavaScript object by leaving one (or more) keys out.
1. Using the Object.assign() Method
In JavaScript, the Object.assign()
method clones properties from one or more source objects to a target object. It then returns the target object.
A straightforward way to clone an object and leave a key out is by cloning the object with Object.assign()
and removing the key from the cloned object using the delete
statement.
Here’s an example of cloning an object and leaving key2
out from the clone:
const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const clone = Object.assign({}, originalObject); delete clone.key2; console.log(clone);
Output:
{ key1: 'value1', key3: 'value3' }
2. Using the Spread Operator (…)
Another way to clone all except for one key in JavaScript is by utilizing the spread operator (…), also called the destructuring operator or “the rest” operator.
The following example code uses object destructuring and the spread operator to create a shallow clone of the originalObject
object:
const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const { key2, ...clone } = originalObject; console.log(clone);
Output:
{ key1: 'value1', key3: 'value3' }
The object destructuring syntax const { key2, …clone } = originalObject;
allows you to extract the values of key2
and the rest of the keys in the originalObject
object and store them in separate variables.
The triple-dot operator (also known as the spread operator) is used to spread out the keys and values of an object into another object. In this case, the spread operator is used to spread out the keys and values of the originalObject
object into a new object called clone
.
Therefore, the clone
object will contain all the keys and values of the originalObject
object except for the key2
key and value, which were extracted and stored in a separate variable using object destructuring.
Notice that this approach might result in warnings in your code editor that warn for “Unused variable key2”.
To suppress this warning, you can for example assign an underscore as the omitted key like this:
const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const { key2: _, ...clone } = originalObject; console.log(clone);
Output:
{ key1: 'value1', key3: 'value3' }
3. Using the Object.keys() and for…in Loops
Of course, you can always use a for loop to re-construct the cloned object and skip adding the one key you want to leave out. This is the most “work-intensive” approach to solving the problem.
For instance, let’s clone an object with three keys and leave the key2
out:
const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const clone = {}; for (const key in originalObject) { if (key !== 'key2') { clone[key] = originalObject[key]; } } console.log(clone);
Output:
{ key1: 'value1', key3: 'value3' }
In JavaScript, the for...in
loop iterates over the object’s properties. In this case, we’re using the loop to copy all the properties of originalObject
to clone
, except for the key2
property which we leave out by performing a simple if-check.
4. The lodash omit() Function
The lodash
library is a popular utility library for JavaScript that provides many utility functions, including the omit()
function. The omit()
function creates a new object by picking all the properties of an object except for the ones specified.
If you’re using lodash
in your project to begin with, or if you don’t have access to ES6 and the above approaches, using the omit()
function can be useful to remove a key from a clone.
Here’s an example:
const _ = require('lodash'); const originalObject = { key1: 'value1', key2: 'value2', key3: 'value3' }; const clone = _.omit(originalObject, 'key2'); console.log(clone);
Output:
{ key1: 'value1', key3: 'value3' }
The lodash
library is a popular utility library for JavaScript that provides many utility functions, including the omit()
function.
The omit()
function creates a new object by picking all the properties of an object except for the ones specified. In this case, we’re using it to create a new object with all the properties of originalObject
except for the key2
property.