1. 程式人生 > >js 淺拷貝與深拷貝

js 淺拷貝與深拷貝

  • 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; }