簡單介紹克隆 JavaScript

大雄45發表於2021-11-13
導讀 這篇文章主要介紹了克隆 JavaScript,克隆又有淺克隆與深克隆,文章圍繞JavaScript淺克隆與深克隆的相關資料展開具體內容,需要的朋友可以參考一下
1、淺克隆

淺克隆無法copy陣列和物件

var obj = {
    name : "abs",
    age : '18',
    sex : 'male'
}
var obj1 = {}
function clone(Origin,target) {
    target = target || {};//防止使用者不輸入target
    for(var k in Origin){
        target[k] = Origin[k];
    }
}
clone(obj,obj1);
2、深克隆

先判斷它是什麼,原始值,陣列還是物件,分別處理

遍歷物件

是原始值直接copy

不是原始值判斷是陣列還是物件

是陣列建空陣列

是物件建空物件

建立了之後再遍歷一遍原始物件或陣列裡是啥

遞迴

var obj = {
    name : 'lin',
    age : '18',
    sex : 'male',
    card : [1,2,3,4],
    wife : {
        name : 'bcsds',
        son : {
            name : 'aaa'
        },
        age : '23'
    }
}
var obj1 = {}
//原始值和物件陣列typeof返回值有區別
function deepClone(origin,target) {
    target = target || {};
    for(var k in origin) {
        if(origin.hasOwnProperty(k)){
            if(typeof(origin[k]) == 'object') {
                if(Object.prototype.toString.call(origin[k]) == '[object Array]') {
                    target[k] = [];
                }else {
                    target[k] = {};
                }
                deepClone(origin[k],target[k]);
            }else {
                target[k] = origin[k];
            }
        }
    }
}
deepClone(obj,obj1);

原文來自:

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69955379/viewspace-2841927/,如需轉載,請註明出處,否則將追究法律責任。