**
一 浅拷贝
**
(1) Object.assign()
var obj1 = {a: 1, b: 2}
var obj2 = Object.assign({}, obj1)
obj2.a = 4
console.log(obj1, obj2)
// {a: 1, b: 2},
// {a: 4, b: 2}
(2) 解构赋值
var obj1 = {a: 1, b: 2}
var obj2 = {...obj1}
obj2.a = 4
console.log(obj1, obj2)
// {a: 1, b: 2},
// {a: 4, b: 2}
但这两种拷贝有一个问题就是只能赋值一层,假设我们有如下数据结构
var obj1 = [{
name: 'Bob',
childs: ['kimi', 'giao']
}]
var obj2 = [...obj1]
obj2[0].childs = []
console.log(obj1, obj2)
**
二、深拷贝
**
(1) 利用json.stringify
var obj1 = [{
name: 'Bob',
childs: ['kimi', 'giao']
}]
var obj2 = JSON.parse(JSON.stringify(obj1))
obj2[0].childs = []
console.log(obj1, obj2)
var obj1 = [{
name: 'Bob',
childs: ['kimi', 'giao'],
fn: function() {},
age: undefined
}]
var obj2 = JSON.parse(JSON.stringify(obj1))
obj2[0].childs = []
console.log(obj1, obj2)
我们从结果中发现,值为undefined,或者function的时候并不会拷贝过来。
(2) 利用递归来实现一个方法进行拷贝
var obj1 = [{
name: 'Bob',
childs: ['kimi', 'giao'],
fn: function() {},
age: undefined
}]
var obj2 = extend(obj1)
obj2[0].childs = []
console.log(obj1, obj2)
function extend(data) {
if (typeof data === 'object' && data) {
let val = typeof data.length === 'number' ? [] : {}
for(let i in data) {
val[i] = extend(data[i])
}
return val
} else {
return data
}
}
(3)利用loadsh的封装方法_.cloneDeep方法实现(代码略)
*
总结
拷贝的目的就是我在拷贝你之后,我和你长得一样,但是又不会影响你
通俗的讲浅拷贝只能拷贝一层(改变这一层不会相互影响),如果遇到基本数据类型直接拷贝,遇到引用类型数据就拷贝地址,例如对象obj => {a:{c:1}, b:666}实行浅拷贝后得到对象obj1,如果obj1修改b或a属性不会影响obj的b或a属性,但是如果obj1修改a.c属性会改变obj的a.c属性,深拷贝就是全部复制,二者所有层数永远独立不会相互影响