js 淺拷貝與深拷貝
阿新 • • 發佈:2019-01-28
js可以把變數分成基本型別和引用型別兩種,基本型別number,string,boolean,null,undefined五種,而除了這五種基本型別,其他都為引用型別。
js的基本型別的值是儲存在棧記憶體中,引用型別是使用棧記憶體儲存地址,堆記憶體儲存物件的值,而=賦值操作符是對棧記憶體進行操作的。所以複製引用型別時就需要使用到淺拷貝和深拷貝
(基本型別與引用型別的詳細文章)
淺複製與深複製的區別
- 淺複製只複製一層物件的屬性,而深複製遞迴複製了所有層級
(hasOwnProperty 檢測是否是有自定義屬性,可以理解為只複製自定義屬性,constructor 返回物件的引用)
淺複製
var obj={
a:1,
arr:[2,3]
}
var shadowObj=shadowCopy(obj);
function shadowCopy(obj){
if(typeof obj !=="object")return;
var newObj;
//保留obj的constructor屬性
if(obj.constructor===Array){
newObj=[];
}else{
newObj={};
newObj.constructor=obj.constructor;
}
var dst=[]
for(var prop in obj){
if(obj.hasOwnProperty(prop)){
dst[prop]=obj[prop]
}
}
return dst;
}
深複製
var obj={
a:1,
b:[2,3]
}
function deepCopy(obj){
var str,newObj=obj.constructor===Array?[]:{};
if(typeof obj !=="object"){
return;
}else if(window.JSON){
//如果支援json,則直接將物件序列化,再進行轉化為json物件,就可以進行復制
str=JSON.stringify(obj);
newObj=JSON.parse(str);
}else{
for(var prop in obj){
newObj[prop]=typeof obj[prop]==="object"?deepCopy(obj[prop]):obj[prop];
}
}
return newObj;
}