js对象的深浅拷贝

5次阅读

共计 1166 个字符,预计需要花费 3 分钟才能阅读完成。

js 对象的深浅拷贝
针对于 JavaScript 的对象和数组 (数组也是对象) 浅拷贝只是引用,内存不变;而深拷贝就是递归赋值。深拷贝是不同内存,相互独立。而浅拷贝会影响
//1. 循环复制数组
var arr = [1,2,3],arr2 = [];
for(var i=0;i<arr.length;i++) {
arr2[i] = arr[i];
}

//2. 还可以用一句简单的代码实现上面的深拷贝:
Array.prototype.push.apply(arr2,arr);

//3. 先把这个对象转化为字符串,在拷贝,再转化回来即可
JSON.parse(JSON.stringify(obj))

别急着走, 利用 window.JSON 的方法做深拷贝存在 2 个 缺点:

如果你的对象里有函数, 函数无法被拷贝下来
无法拷贝对象原型链上的属性和方法

例如下面这种情况: 对象里包含函数
var o1 = {
name:” 小明 ”,
age:12,
city:” 广州 ”,
schools:[“ 小学 ”,” 中学 ”,” 大学 ”],
say:function(){
alert(this.name);
}
}
// 下面的方法可以实现 深深度复制(复制包括函数)
function deepClone(oldObj){
var newObj = {};
for(var key in oldObj){
if(oldObj.hasOwnProperty(key)){
if(oldObj[key].constructor == Array){// 判断 oldObj[key]值是否数组 / 对象
newObj[key] = oldObj[key].slice();
}else if(oldObj[key].constructor == Object){
newObj[key] == deepClone(oldObj[key]);
}else{
newObj[key] = oldObj[key];
}
}
}
return newObj;
}
var o2 = deepClone(o1);
当然, 你明确知道他们的缺点后, 如果他的缺点对你的业务需求没有影响, 就可以放心使用了, 一行原生代码就搞定。目前我在开发业务场景中,大多还真可以忽略上面 2 个缺点。往往需要深拷贝的对象里没有函数,也不需要拷贝它原型链上的属性。
js 堆栈
由于 js 中的对象都是复杂数据类型, 这种数据在内存中存储的时候, 存放在堆中。当简单赋值的时候,其实是将该对象的指针指向同一个堆地址。简单的数据类型存放在栈中,当对简单的数据类型进行赋值的时候,其实就是直接在栈中新开辟一个地方专门存储一样的值。
数据结构里的堆栈: 栈(stack): 由编译器自动分配, 存放函数的参数值, 局部变量的值等. 其操作方式类似于数据结构中的栈. 堆(heap): 一般由程序员分配释放, 若程序员不释放, 程序结束时可能由 OS 回收. 这里 OS 是指: 操作系统(Operating System)

正文完
 0