1、賦值

修改新物件原來的物件會發生改變(改變儲存空間，聯動改變)

 let person = {
        name: 'Tom',
        age: 12,
        hobby: ['音樂', '動漫']
    }
    let copyObj = person;
    copyObj.name = '小明';
    copyObj.hobby[0] = '看電視'
    console.log(copyObj, person);
    // { name: '小明', age: 12, hobby: [ '看電視', '動漫' ] } { name: '小明', age: 12, hobby: [ '看電視', '動漫' ] }
 

2、淺拷貝

淺拷貝 基本型別直接拷貝值（新變原不變），引用型別拷貝記憶體地址（新變原變）

2.1 使用shallowCopy函式完成淺拷貝

let person = {
        name: 'Tom',
        age: 12,
        hobby: ['音樂', '動漫']
    }
    function shallowCopy(object) {
        var target = {}
        for (const key in object) {
            if (object.hasOwnProperty(key)) {
                target[key] = object[key]
            }
        }
        return target
    }
    let copyObj = shallowCopy(person);
    copyObj.name = '小紅';
    copyObj.hobby[0] = '看電影';
    console.log(copyObj, person);
    // { name: '小紅', age: 12, hobby: [ '看電影', '動漫' ] } { name: 'Tom', age: 12, hobby: [ '看電影', '動漫' ] }
 

2.2 使用ES6中的擴充套件運算子完成淺拷貝

let person = {
        name: 'Tom',
        age: 12,
        hobby: ['音樂', '動漫']
    }
    let copyObj = { ...person };
    copyObj.age = '20';
    copyObj.name = 'Jerry';
    copyObj.hobby[0] = '看文學名著'
    console.log(copyObj, person)
    // { name: 'Jerry', age: '20', hobby: [ '看文學名著', '動漫' ] } { name: 'Tom', age: 12, hobby: [ '看文學名著', '動漫' ] }
 

3、深拷貝

深拷貝 新變原不變（在堆記憶體中開闢新的區域，修改不會影響原來的）

3.1 使用deepClone函式實現深拷貝

let person = {
        name: 'Tom',
        age: 12,
        hobby: ['音樂', '動漫']
    }
    function deepClone(object) {
        var cloneObj = Array.isArray(object) ? [] : {};
        if (object === null) return object
        if (object instanceof Date) return new Date(object)
        if (object instanceof RegExp) return new RegExp(object)
        if (typeof object !== 'object') return object
        for (const key in object) {
            if (object.hasOwnProperty(key)) {
                cloneObj[key] = deepClone(object[key])
            }
        }
        return cloneObj
    }

    let copyObj = deepClone(person);
    copyObj.name = 'Marry';
    copyObj.age = 18;
    copyObj.hobby[0] = 'football';
    console.log(copyObj, person);
    // { name: 'Marry', age: 18, hobby: [ 'football', '動漫' ] } { name: 'Tom', age: 12, hobby: [ '音樂', '動漫' ] }

3.2 JSON物件可以使用JSON.parse(JSON.stringify(object)) 的方法實現深拷貝

let obj = {
        key: 1,
        person: {
            name: 'Marry',
            age: 12
        }
    }
    let copyObj = JSON.parse(JSON.stringify(obj));
    copyObj.key = 2;
    copyObj.person.name = 'Bob';
    copyObj.person.age = 13;
    console.log(copyObj,obj)
    // { key: 2, person: { name: 'Bob', age: 13 } } { key: 1, person: { name: 'Marry', age: 12 } }

4、共用方法

4.1 Object.assign()

Object.assign()可實現深拷貝和淺拷貝（當只有一層時為深拷貝，兩層及以上為淺拷貝）

let bookInfo = {
        name: '西遊記',
        autor: '吳承恩',
        sellstaus: '良好'
    }
    let person = {
        name: 'Tom',
        age: 12,
        hobby: ['音樂', '動漫']
    }
    let copyObj1 = Object.assign({}, bookInfo);
    let copyObj2 = Object.assign({}, person);
    copyObj1.name = '紅樓夢',
    copyObj1.autor = '曹雪芹',
    copyObj1.sellstaus = '中等'

    copyObj2.name = '小明',
    copyObj2.age = 22,
    copyObj2.hobby[0] = 'basketball'
    console.log(copyObj1, copyObj2)
    // { name: '紅樓夢', autor: '曹雪芹', sellstaus: '中等' } { name: '小明', age: 22, hobby: [ 'basketball', '動漫' ] }

4.2 使用Jquery中的extend方法實現深拷貝和淺拷貝

• 淺拷貝
  => 語法: $.extend(物件1, 物件2, 物件3, …)
  => 作用: 把從 物件2 開始的所有物件內的資料進行淺拷貝到 物件1 內
  => 實現的是淺拷貝

• 深拷貝
  => 語法: $.extend(true, 物件1, 物件2, 物件3, …)
  => 作用: 把從 物件2 開始的所有物件內的資料進行深拷貝到 物件1 內
  => 實現的是深拷貝