Cacher is the code snippet organizer for pro developers

浅拷贝

原生方法

slice()

arr.slice()

concat()

arr.concat()

Object.assign()

Object.assign({}, obj)

Array.from()

Array.from(arr)

扩展运算符(...)

[...arr]

浅拷贝的通用方法

实现思路：遍历对象，把属性和属性值都放在一个新的对象里

var shallowCopy = function (obj) {
  // 只拷贝对象
  if (typeof obj !== 'object') return;
  // 根据obj的类型判断是新建一个数组还是一个对象
  var newObj = obj instanceof Array ? [] : {};
  // 遍历obj,并且判断是obj的属性才拷贝
  for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
      newObj[key] = obj[key];
    }
  }
  return newObj;
}

深拷贝

原生方法

JSON.parse(JSON.stringify(ary)) //利用 JSON 进行忽略原型链的深拷贝

此方法适用于 Object 的深度拷贝，因为 Array 属于 Object 类型，所以也适用于此处

需要注意的是：该方法会忽略掉值为 undefined 和 function 的属性，但不会忽略值为 null 的属性

深拷贝的通用方法

实现思路：拷贝的时候判断属性值的类型，如果是对象，继续递归调用深拷贝函数

var deepCopy = function(obj) {
  // 只拷贝对象
  if (typeof obj !== 'object') return;
  // 根据obj的类型判断是新建一个数组还是一个对象
  var newObj = obj instanceof Array ? [] : {};
  for (var key in obj) {
    // 遍历obj,并且判断是obj的属性才拷贝
    if (obj.hasOwnProperty(key)) {
      // 判断属性值的类型，如果是对象递归调用深拷贝
      newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
    }
  }
  return newObj;
}

第三方库实现深拷贝

jQuery $.extend()方法

//默认浅拷贝
$.extend(object1, object2);

//深拷贝
$.extend(true, object1, object2);

lodash

_.clone(value)
_.cloneDeep(value)