首先要明白:传值与传址,内存的堆栈
1,Object.assign()
var a = { name: "hello" }
var b = Object.assign({}, a)
b.name = 'hi'
console.log(a.name) //hello
Object.assign()只适用于浅拷贝,如下:
var a = { info: { name: "hello"} }
var b = Object.assign({}, a)
b.info.name = 'hi'
console.log(a) //{ info: { name: "hi"} }
2. 展开运算符(...)
var a = { name: "hello" }
var b = {...a}
b.name = 'hi'
console.log(a.name) //hello
展开运算符同样只适用浅拷贝。
3. JSON.parse()和JSON.stringify()
先转成字符串,再转换成JSON格式。适用于深拷贝
var a = { info: {name: "hello"} }
var b = JSON.parse(JSON.stringify(a))
b.name = 'hi'
console.log(a) //{ info: {name: "hello"} }
但是,本方案有限制,只适用于对象是JSON格式的。当对象内部有方法时不适用。
4.for...in & 递归
(1)浅拷贝
var a = {name: "hello"}
var b = copy(a)
function copy(obj){
var result = {}
for(var attr in obj){
result[attr] = obj[attr]
}
return result
}
console.log(b) //{name: "hello"}
b.name = 'hi'
console.log(a) //{name: "hello"}
(2)深拷贝
var a = { info: {name: "hello"} }
var b = deepCopy(a)
function deepCopy(obj){
var result = {}
for(var attr in obj){
// 判断obj的属性是不是对象,是则递归再次调用deepCopy()
if( typeof obj[attr] == 'object'){
result[attr] = deepCopy(obj[attr])
} else{
result[attr] = obj[attr]
}
}
return result
}
console.log(b) //{ info: {name: "hello"} }
b.name = 'hi'
console.log(a) //{ info: {name: "hello"} }
最佳拷贝方案:
例如:obj长下面这个样子,如何将obj拷贝给obj1
var obj = {
name: 'zhangsan',
age: 20,
card: ['visa', 'master'],
wife: {
name: 'lucy',
son: {
name: 'aaa'
}
}
}
var obj1 = {}
思考步骤:
第0步:首先是遍历对象。对象的遍历可通过for...in来实现
第一步:判断是不是原始值?是的话,可以直接赋值拷贝
第二步:不是原始值的话,判断是对象还是数组?(可用toString, instanceof 和constructor来判断数组or对象)
Object.prototype.toString.call([]) //"[object Array]"
Object.prototype.toString.call({}) //"[object Object]"
第三步:递归(循环第一步)
上代码:
简短说明:因为Object.prototype.toString()太长了,为了看起来更方便,先把它用toStr表示
function deepCopy(origin, target){
var target = target || {},
toStr = Object.prototype.toString(),
arrStr = "[object Array]"
for(var prop in origin) {
if(typeof(origin[prop]) == 'object'){
// 是引用值。再判断是数组还是对象?
if(toStr.call(origin[prop]) == arrStr) {
target[prop] = []
} else {
target[prop] = {}
}
deepCopy(origin[prop], target[prop])
}
else {
target[prop] = origin[prop]
}
}
return target
}
更完善的写法:
function deepCopy(origin, target){
var target = target || {},
toStr = Object.prototype.toString(),
arrStr = "[object Array]"
for(var prop in origin) {
if(origin.hasOwnPrototy(prop)) { //判断是不是原型上的数据,不拷贝原型上的数据
if(origin[prop] !== null && typeof(origin[prop]) == 'object'){
// 是引用值。再判断是数组还是对象?
if(toStr.call(origin[prop]) == arrStr) {
target[prop] = []
} else {
target[prop] = {}
}
deepCopy(origin[prop], target[prop])
}
else {
target[prop] = origin[prop]
}
}
}
return target
}