To clone or copy a JavaScript object, you can use Destructuring Assignment.
The
destructuring assignment
syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.In this tutorial, I will show you how to clone a JavaScript object using Destructuring Assignment.
Cloning Javascript object
To clone a Javascript object, you can use the array destructuring syntax { ...object }
on your object.
const person = {
id:"704a9b5e-e7dc-445f-994d-d61df95db949",
name:"Wilson",
age: 45,
gender:"male"
}
const personClone = {...person};
console.log(personClone);
// 👇🏼 See the output below
{
id: '704a9b5e-e7dc-445f-994d-d61df95db949',
name: 'Wilson',
age: 45,
gender: 'male'
}
Cloning Javascript object except one property
For omitting one property from your object clone, you can list it before the destructuring like this – { ignoredProperty, ...otherProperties }
, so that it will be ignored.
const person = {
id:"704a9b5e-e7dc-445f-994d-d61df95db949",
name:"Wilson",
age: 45,
gender:"male"
}
const {age,...otherProperties} = person;
const personClone = {...otherProperties};
console.log(personClone);
// 👇🏼 See the output below
{
id: '704a9b5e-e7dc-445f-994d-d61df95db949',
name: 'Wilson',
gender: 'male'
}
Cloning Javascript object except some property
For omitting many properties from your object clone, you can list it before the destructuring like this { ignoredProperty1, ignoredProperty2 ,...otherProperties }
so that it will be ignored.
const person = {
id:"704a9b5e-e7dc-445f-994d-d61df95db949",
name:"Wilson",
age: 45,
gender:"male"
}
const {age, gender ,...otherProperties} = person;
const personClone = {...otherProperties};
console.log(personClone);
// 👇🏼 See the output below
{
id: '704a9b5e-e7dc-445f-994d-d61df95db949',
name: 'Wilson'
}
🔍. Similar posts
How to Fix Mutation Bugs in Your React Complex State Logic
10 Feb 2025
Everything You Need to Know About CSS Style Rules
09 Feb 2025
How to Use Form Controls and Data Binding Effectively in React Forms
08 Feb 2025