JavaScript遞歸實(shí)現(xiàn)對(duì)象深拷貝

lunaticf 發(fā)布于2019-08-23 18:09 / 1654人閱讀

摘要：遞歸實(shí)現(xiàn)對(duì)象深拷貝遞歸實(shí)現(xiàn)對(duì)象深拷貝是否存在如果不存在創(chuàng)建空對(duì)象判斷是否為引用數(shù)據(jù)類型剝離原型鏈的數(shù)據(jù)判斷是否為引用數(shù)據(jù)類型對(duì)象或數(shù)組輔助函數(shù)判定是否是對(duì)象深拷貝面的所有屬性值到對(duì)象里面拷貝對(duì)象目標(biāo)對(duì)象如果是值類型，那么就直接拷貝賦值如果是

1.JavaScript遞歸實(shí)現(xiàn)對(duì)象深拷貝

        function deepClone(origin,target){
            //target是否存在如果不存在創(chuàng)建空對(duì)象
            let tar = target || {},
            //判斷是否為引用數(shù)據(jù)類型
                toStr = Object.prototype.toString,
                arrType="[object Array]";

            for(let key in origin){
                //剝離原型鏈的數(shù)據(jù)
                if(origin.hasOwnProperty(key)){
                    //判斷是否為引用數(shù)據(jù)類型 對(duì)象或數(shù)組
                    if(typeof(origin[key]) === "object" && origin[key] !== null){
                        if(toStr.call(origin[key]) === arrType ){
                            tar[key] = [];
                        }else{
                            tar[key] = {};
                        }
                        deepClone(origin[key],tar[key]);
                    }else{
                        tar[key] = origin[key];
                    }
                }
            }
            return tar;
        }

/**
 * 輔助函數(shù), 判定是否是對(duì)象
 * @param obj
 * @returns {boolean}
 */
function isObj(obj) {
  return obj instanceof Object;
}
 
/**
 * 深拷貝fromObj面的所有屬性/值, 到toObj對(duì)象里面
 * @param fromObj 拷貝對(duì)象
 * @param toObj  目標(biāo)對(duì)象
 */
function deepCopyObj2NewObj(fromObj, toObj) {
  for (var key in fromObj) {
    if(fromObj.hasOwnProperty(key)){
      var fromValue = fromObj[key];
      // 如果是值類型，那么就直接拷貝賦值
      if (!isObj(fromValue)) {
        toObj[key] = fromValue;
      } else {
        // 如果是引用類型，那么就再調(diào)用一次這個(gè)方法，
        // 去內(nèi)部拷貝這個(gè)對(duì)象的所有屬性
        // fromValue是什么類型, 創(chuàng)建一個(gè)該類型的空對(duì)象
        var tmpObj = new fromValue.constructor;
 
        // console.log(tmpObj);
        // debugger;
        deepCopyObj2NewObj(fromValue, tmpObj);
        toObj[key] = tmpObj;
      }
    }
  }
}

GPU云服務(wù)器云服務(wù)器 javascript深拷貝深拷貝深拷貝和淺拷貝 javascript淺拷貝

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/104750.html

相關(guān)文章

JavaScript：利用遞歸實(shí)現(xiàn)對(duì)象深拷貝

摘要：先來(lái)普及一下深拷貝和淺拷貝的區(qū)別淺拷貝就是簡(jiǎn)單的復(fù)制，用等號(hào)即可完成這就完成了一個(gè)淺拷貝但是當(dāng)修改對(duì)象的時(shí)候，我們發(fā)現(xiàn)對(duì)象的值也被改變了這是因?yàn)闇\拷貝只復(fù)制了指向?qū)ο蟮闹羔?，新舊對(duì)象共用同一塊內(nèi)存，修改某一個(gè)對(duì)象的同時(shí)也會(huì)把另一個(gè)都一并修改先來(lái)普及一下深拷貝和淺拷貝的區(qū)別淺拷貝：就是簡(jiǎn)單的復(fù)制，用等號(hào)即可完成 let a = {a: 1} let b = a 這就完成了一個(gè)淺拷貝但是...

Airy 2019-08-23 10:49 評(píng)論0 收藏0
JavaScript中的淺拷貝和深拷貝

摘要：在中可以通過(guò)添加一個(gè)參數(shù)來(lái)實(shí)現(xiàn)遞歸，調(diào)用就可以實(shí)現(xiàn)一個(gè)深拷貝。利用序列化實(shí)現(xiàn)一個(gè)深拷貝在JavaScript中，對(duì)于Object和Array這類引用類型值，當(dāng)從一個(gè)變量向另一個(gè)變量復(fù)制引用類型值時(shí)，這個(gè)值的副本其實(shí)是一個(gè)指針，兩個(gè)變量指向同一個(gè)堆對(duì)象，改變其中一個(gè)變量，另一個(gè)也會(huì)受到影響。這種拷貝分為兩種情況：拷貝引用和拷貝實(shí)例，也就是我們說(shuō)的淺拷貝和深拷貝淺拷貝（shallow...

ernest.wang 2019-08-21 11:34 評(píng)論0 收藏0
JavaScript之淺、深拷貝

摘要：前言里面淺拷貝和深拷貝是非常關(guān)鍵的知識(shí)點(diǎn)，今天就來(lái)通過(guò)本文清楚的了解深淺拷貝以及該如何實(shí)現(xiàn)這兩種拷貝方式。對(duì)象的拷貝又分為淺拷貝和深拷貝。印證了上述所說(shuō)的對(duì)于所有的基本類型，簡(jiǎn)單的賦值已經(jīng)是實(shí)現(xiàn)了深拷貝。前言 JavaScript里面淺拷貝和深拷貝是非常關(guān)鍵的知識(shí)點(diǎn)，今天就來(lái)通過(guò)本文清楚的了解深淺拷貝以及該如何實(shí)現(xiàn)這兩種拷貝方式。深淺拷貝的區(qū)別拷貝：其實(shí)就是一個(gè)對(duì)象復(fù)制給另外...

leanxi 2019-08-26 10:37 評(píng)論0 收藏0
淺談JavaScript 中深拷貝實(shí)現(xiàn)的方法

摘要：相信人很多學(xué)習(xí)的過(guò)程中都踩了深拷貝和淺拷貝的坑，深拷貝和淺拷貝的區(qū)別我就不再贅述了，今天我來(lái)寫(xiě)一下我自己實(shí)現(xiàn)深拷貝的各種方法。中的深拷貝也是用類似方法實(shí)現(xiàn)。相信人很多學(xué)習(xí)js的過(guò)程中都踩了深拷貝和淺拷貝的坑，深拷貝和淺拷貝的區(qū)別我就不再贅述了，今天我來(lái)寫(xiě)一下我自己實(shí)現(xiàn)深拷貝的各種方法。比較簡(jiǎn)單的拷貝方式可以借用瀏覽器的Json對(duì)象去實(shí)現(xiàn)，先把對(duì)象轉(zhuǎn)化為json字符串，在解析回對(duì)...

Vicky 2019-08-20 13:50 評(píng)論0 收藏0
JavaScript基礎(chǔ)心法——深淺拷貝

摘要：原文地址基礎(chǔ)心法深淺拷貝歡迎。上面的代碼是最簡(jiǎn)單的利用賦值操作符實(shí)現(xiàn)了一個(gè)淺拷貝，可以很清楚的看到，隨著和改變，和也隨著發(fā)生了變化。展開(kāi)運(yùn)算符結(jié)論實(shí)現(xiàn)的是對(duì)象第一層的深拷貝。原文地址：JavaScript基礎(chǔ)心法——深淺拷貝歡迎star。如果有錯(cuò)誤的地方歡迎指正。淺拷貝和深拷貝都是對(duì)于JS中的引用類型而言的，淺拷貝就只是復(fù)制對(duì)象的引用，如果拷貝后的對(duì)象發(fā)生變化，原對(duì)象也會(huì)發(fā)生...

keithxiaoy 2019-08-21 17:22 評(píng)論0 收藏0