前几次面试被问到堆存储,栈存储,以及对象的克隆。后来通过查资料,个人理解(成长中……)如下:
- 分析克隆前,我们需要知道点基础的数据在堆栈中的存储机制:
js中数据类型的分类:1>原始类型(number,boolean,string,null,undefined)2>引用类型(代表object)
堆栈中数据存储的情况:
a. 原始类型的这种变量的名字和对应的值都存储在栈中,克隆时直接就将值也一起克隆过来了。
b. 引用类型的如object,栈中存储的是名字和对应值的地址信息而堆中存放的就是地址对应的值。这也就是为什么,我们直接使用同普通方法一样的克隆(浅克隆),其实我们克隆的是对应的地址并不是真正的值,当我们改变之前对象的属性值时会导致堆中的值变化从而克隆体对应的属性值也跟着变化(绕晕了……)。
浅克隆:
let obj = {
name:'苍老师',
age: 18,
size: 'D',
time:{
start:30,
working:60,
end:20
},
factory:function(man){
return man+'film';
}
}
let obj_f = obj;
console.log(obj_f);
执行结果:
继续,改变原体(最初的本体)的属性值->
obj.time.working=120;
console.log(obj,obj_f);
执行结果克隆体也跟着变化:
要想做一个真正的有思想不被他人所牵制也不影响他人的独立自由的个体,那当然是要将本体的所有东西都变成我们自己的了。
接着我们开始制造一台深克隆机器:
function deepClone(obj){
if(typeof obj !== 'object') return obj;
var _obj = Array.isArray(obj)? []:{};
if (typeof obj === 'object'){
for(attr in obj){
if(typeof obj[attr] === 'object'){
_obj[attr] = deepClone(obj[attr]);
}else{
_obj[attr] = obj[attr];
}
}
return _obj;
}
}
发动机器开始克隆:
let obj_f = deepClone(obj);
console.log(obj_f);
克隆的克隆体:
这家伙好像和普通的克隆也没啥不一样,但是他现在已经是一个独立的对象了,客官里面请:
obj.time.working=120;
console.log(obj,obj_f);
有啥不一样:
就是不一样,从此她只为你所用,再也不担心被他人影响了。
此生得一克隆机
关于克隆大法,今天就到这