JS浅拷贝 - Javascript

在Javascript开发中，经常涉及到对象（Object）和数组（Array）的复制和克隆，这时浅拷贝和深拷贝的概念就显得特别重要了。

什么是浅拷贝

浅拷贝是指在复制对象或数组时，只复制其基本数据类型，不会复制其引用数据类型。也就是说，在浅拷贝后得到的新对象或数组，与原对象或数组具有相同的数据，但其引用类型值指向的是原对象或数组中的引用类型值。

实现浅拷贝

Object.assign

Object.assign()方法可以用于将一个或多个源对象的属性复制到目标对象。它会返回目标对象。

let obj = { a: 1, b: { c: 2 } };
let newObj = Object.assign({}, obj);

console.log(obj === newObj); // false
console.log(obj.b === newObj.b); // true, 引用类型值指向同一个引用

手写实现

浅拷贝的手写实现通常使用for...in循环遍历对象或数组，将其基本数据类型赋值给新对象或数组。

// 对象的浅拷贝
function shallowCopy(obj) {
  let result = {};

  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      result[key] = obj[key];
    }
  }

  return result;
}

// 数组的浅拷贝
function shallowCopy(arr) {
  let result = [];

  for (let i = 0, len = arr.length; i < len; i++) {
    result[i] = arr[i];
  }

  return result;
}

注意事项

浅拷贝对于基本数据类型可以完美复制，但对于引用数据类型仅仅是复制其引用地址，修改新对象或数组内的引用类型值时，会影响到原对象或数组。所以在使用浅拷贝时，需要特别注意引用类型值的处理。

结论

浅拷贝虽然简单，但只能做到对象和数组的表面复制，不适用于涉及引用类型的复杂应用场景。如果需要完全保证数据独立，请使用深拷贝。