浅克隆与深克隆

克隆的概念

浅度克隆：原始类型为值传递，对象类型仍为引用传递。
深度克隆：所有元素或属性均完全复制，与原对象完全脱离，也就是说所有对于新对象的修改都不会反映到原对象中。

浅克隆

// 定义两个变量，将一个变量的赋给另一个变量
let copy1 = {a: 'copy1'}
let copy2 = copy1
#console.log(copy1.a) // copy1
#console.log(copy2.a) // copy1
//此时改变一个变量的值
copy2.a = 'copy2'
#console.log(copy1.a) // copy2
#console.log(copy2.a) // copy2

浅复制方法会改变起源赋值对象的值，这种方法有利也有弊

利：赋值对象数据同步更新
弊：如果只想克隆一个对象，两个对象初始值是一样，但后续变化毫不相干时，这种方法就做不到这一点

所以就此引出深克隆

深克隆

// 深度克隆
function deepClone (obj) {
  var result = null
  var oClass = isClass(obj)
  // 确定result的类型
  if (oClass === 'Object') {
    result = {}
  } else if (oClass === 'Array') {
    result = []
  } else {
    return obj
  }
  for (var key in obj) {
    var copy = obj[key]
    if (isClass(copy) === 'Object') {
      // 递归调用
      result[key] = deepClone(copy)
    } else if (isClass(copy) === 'Array') {
      result[key] = deepClone(copy)
    } else {
      result[key] = obj[key]
    }
  }
  return result
}
// 返回传递给他的任意对象的类
function isClass (o) {
  if (o === null) return 'Null'
  if (o === undefined) return 'Undefined'
  return Object.prototype.toString.call(o).slice(8, -1)
}

let copy1 = {a: 'copy1'}
let copy2 = deepClone(copy1)
#console.log(copy1.a) // copy1
#console.log(copy2.a) // copy1
#// 此时改变copy2值
copy2.a = 'copy2'
#// 再次打印copy1
#console.log(copy1.a) // copy1

此例可以看出深度克隆实现了 克隆对象 后续变量变化互不相干
从而证实上述克隆的理论概念。

[归类：javascript]