文章目录

• • • • 一、浅拷贝（修改新对象会改到原对象）
      • • • 【1】通过= 直接赋值
          • 【2】Object.assign（）方法
      • 二、深拷贝（修改新对象不会改到原对象）
      • • • 【1】通过JSON对象来实现深拷贝
          • 【2】 Object.create（）方法
          • 【3】使用扩展运算符实现深拷贝
      • 三、要点：

一、浅拷贝（修改新对象会改到原对象）

【1】通过= 直接赋值

var obj1 = {
    name: '诸葛亮',
    gender: '男',
    age: 20
};
var obj2 = obj1;

obj2.age = 30;
console.log(obj2);  //name: '诸葛亮', gender: '男', age: 30
console.log(obj1);  //name: '诸葛亮', gender: '男', age: 30

【2】Object.assign（）方法

var obj1 = {
    name: '诸葛亮',
    gender: '男',
    age: 20
};
var obj2=Object.assign(obj1)
 
obj2.age = 30;
console.log(obj2.age);  // age: 30
console.log(obj1.age);  // age: 30 

二、深拷贝（修改新对象不会改到原对象）

【1】通过JSON对象来实现深拷贝

var obj3 = {
    number: 1111,
    city: '西安'
}
var obj4 = JSON.parse(JSON.stringify(obj3));

obj4.city = '深圳';
console.log(obj3.city);  //'西安'
console.log(obj4.city);  //'深圳'

【2】 Object.create（）方法

var obj3 = {
    number: 1111,
    city: '杭州'
}
var obj4 = Object.create(obj3)
 
obj4.city = '深圳';
console.log(obj3.city);  //'杭州'
console.log(obj4.city);  //'深圳'

【3】使用扩展运算符实现深拷贝

var obj3 = {
    number: 1111,
    city: '杭州'
}
var obj4 = { ...obj3, number: 2021 }
 
console.log(obj3.number);  //1111
console.log(obj4.number);  //2021

三、要点：