1. Object.assign

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。

  1. // Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。
  2. let target = { a: 1 }
  3. let object1 = { b: 2 }
  4. let object2 = { c: 3 }
  5. Object.assign(target, object1, object2)
  6. console.log(target); // { a: 1,b: 2,c: 3 }

2. 扩展运算符…

  1. // 使用扩展运算符,当扩展运算符在第一层的时候实现的是深拷贝,多层对象时实现的是浅拷贝
  2. let obj1 = { a: 1, b: { c: 1 } }
  3. let obj2 = { ...obj1 };
  4. obj1.a = 2;
  5. console.log(obj1); //{a:2,b:{c:1}}
  6. console.log(obj2); //{a:1,b:{c:1}}
  7. obj1.b.c = 2;
  8. console.log(obj1); //{a:2,b:{c:2}}
  9. console.log(obj2); //{a:1,b:{c:2}}

3. 数组的方法实现深浅拷贝

  1. let arr = [1, 2, 3, [2], 4];
  2. console.log(arr.concat()); // [1,2,3,4]
  3. console.log(arr.concat() === arr); //false

4. 手写一个浅拷贝

  1. // 手写一个浅拷贝
  2. function shallowCopy(obj) {
  3. if (!obj || typeof obj !== "object") return;
  4. let newObject = Array.isArray(obj) ? [] : {}
  5. for (let key in obj) {
  6. if (obj.hasOwnProperty(key)) { // 循环,也会循环原型链上的属性,所以这里需要判断一下
  7. newObject[key] = obj[key]
  8. }
  9. }
  10. return newObject
  11. }
  12. let data = {
  13. name: 'zs',
  14. age: 20,
  15. main: {
  16. a: 1,
  17. b: 2
  18. }
  19. }
  20. //由于name是基本数据类型,会开辟一个新的地址来储存我们拷贝的内容,所以原数据的name属性不会被修改
  21. //main是引用类型,浅拷贝会直接拷贝它的地址,所以原数据的这个值也会改变
  22. let obj1 = shallowCopy(data)
  23. console.log(obj1);
  24. obj1.name = 'ls'
  25. console.log(obj1);
  26. obj1.main.a = 3
  27. console.log(obj1);