vue 深拷贝对象、数组

1、复制数组而不指向同一个对象（深拷贝）

const _ = require('lodash');

let one_brand = [
    {name: 'A', count: 1, value: Infinity},
    {name: 'B', count: 2},
]

// 深拷贝
// 方法一
let two_brand = one_brand.map(o => Object.assign({}, o));
// 方法二
let two_brand = one_brand.map(o => ({...o}));
// 方法三（推荐）
let two_brand = _.cloneDeep(one_brand);

//该方法仅限于可被JSON.stringify解析的对象。

let newarr = JSON.parse(JSON.stringify(arr));

2、复制数组，数组为另一个对象，但数组内的元素仍然指向同个对象

//方法一：
let newarr = arr.slice(0);

//方法二：
let newarr = {...arr};

3、复制且指向同一个对象（浅拷贝）

let newarr = arr;

4、使用：es6中的“对象扩展运算符”

    // 对象深拷贝
    obejctCopy() {
      // 源对象小李
      const source = { name: '小李', age: 18, gender: '男', school: '清华大学' }
      // 拷贝小李
      const copy1 = { ...source }
      // 拷贝小李，并修改名字为小张
      const copy2 = { ...source, name: '小张' }
      // 修改源对象
      source.age = 19
      // 查看结果
      console.log(source) // { name: '小李', age: 19, gender: '男', school: '清华大学' }
      console.log(copy1) // { name: '小李', age: 18, gender: '男', school: '清华大学' }
      console.log(copy2) // { name: '小张', age: 18, gender: '男', school: '清华大学' }

    }

当对象中还包含对象时，则里层对象还是浅拷贝

      // 源对象小李
      // const source = { name: '小李', age: 18, gender: '男', school: '清华大学' }
      const source = { name: '小李', age: 18, gender: '男', school: '清华大学', more: { a: "test", b: 2, c: {} } }
      // 拷贝小李
      const copy1 = { ...source }
 
      console.log(source === copy1)               // false
      console.log(source.more === copy1.more)     // true

若要里层拷贝则需要再次使用...，如下

      // 源对象小李
      // const source = { name: '小李', age: 18, gender: '男', school: '清华大学' }
      const source = { name: '小李', age: 18, gender: '男', school: '清华大学', more: { a: "test", b: 2, c: {} } }
      // 拷贝小李
      const copy1 = { ...source, more: { ...source.more } }
 
      console.log(source === copy1)               // false
      console.log(source.more === copy1.more)     // false