JavaScript对象是一种复杂的数据类型,可以包含各种数据类型。例如,
let person = {
name: 'John',
age: 21,
}
在这里, person
是一个对象。现在,您无法通过执行以下操作来克隆副本。
let copy = person;
console.log(copy); // {name: "John", age: 21}
在上述程序中, copy
变量的值与人员对象的值相同。但是,如果更改copy
对象的值,则person
对象中的值也会更改。例如,
copy.name = 'Peter';
console.log(copy.name); // Peter
console.log(person.name); // Peter
因为对象是引用类型,所以在两个对象中都可以看到更改。复制和人都指向同一个对象。
例子1.使用Object.assign()克隆对象
// program to clone the object
// declaring object
let person = {
name: 'John',
age: 21,
}
// cloning the object
const clonePerson = Object.assign({}, person);
console.log(clonePerson);
// changing the value of clonePerson
clonePerson.name = 'Peter';
console.log(clonePerson.name);
console.log(person.name);
输出
{name: "John", age: 21}
Peter
John
Object.assign()
方法是ES6标准的一部分。 Object.assign()
方法执行深度复制,并复制一个或多个对象的所有属性。
注意 :空{}
作为第一个参数,可确保您不更改原始对象。
示例2:使用Spread语法克隆对象
// program to clone the object
// declaring object
let person = {
name: 'John',
age: 21,
}
// cloning the object
const clonePerson = { ... person}
console.log(clonePerson);
// changing the value of clonePerson
clonePerson.name = 'Peter';
console.log(clonePerson.name);
console.log(person.name);
输出
{name: "John", age: 21}
Peter
John
扩展语法...
在更高版本(ES6)中引入。
传播语法可用于制作对象的浅表副本。这意味着它将复制对象。但是,将引用更深层次的对象。例如,
let person = {
name: 'John',
age: 21,
// the inner objects will change in the shallow copy
marks: { math: 66, english: 73}
}
// cloning the object
const clonePerson = { ... person}
console.log(clonePerson); // {name: "John", age: 21, marks: {…}}
// changing the value of clonePerson
clonePerson.marks.math = 100;
console.log(clonePerson.marks.math); // 100
console.log(person.marks.math); // 100
在这里,当内部对象值math
变化为100 clonePerson
对象时,价值math
中的关键person
对象也发生变化。
示例3:使用JSON.parse()克隆对象
// program to clone the object
// declaring object
let person = {
name: 'John',
age: 21,
}
// cloning the object
const clonePerson = JSON.parse(JSON.stringify(person));
console.log(clonePerson);
// changing the value of clonePerson
clonePerson.name = 'Peter';
console.log(clonePerson.name);
console.log(person.name);
输出
{name: "John", age: 21}
Peter
John
在上面的程序中, JSON.parse()
方法用于克隆对象。
注意 : JSON.parse()
仅适用于Number
和String
以及对象字面量。它不适用于具有function
或symbol
属性的对象字面量 。