克隆的概念
浅度克隆:原始类型为值传递,对象类型仍为引用传递。
深度克隆:所有元素或属性均完全复制,与原对象完全脱离,也就是说所有对于新对象的修改都不会反映到原对象中。
浅克隆
// 定义两个变量,将一个变量的赋给另一个变量
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]