成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

【轉(zhuǎn)】JavaScript 對(duì)象的深度克隆

JowayYoung / 1561人閱讀

摘要：在聊以下簡(jiǎn)稱深度克隆之前，我們先來(lái)了解一下中對(duì)象的組成?？寺』蛘呖截惙譃榉N淺度克隆深度克隆。淺度克隆基本類型為值傳遞，對(duì)象仍為引用傳遞。

該文轉(zhuǎn)載自http://www.cnblogs.com/zichi/p/4568150.html，有部分修改。

在聊JavaScript（以下簡(jiǎn)稱js）深度克隆之前，我們先來(lái)了解一下js中對(duì)象的組成。
在 js 中一切實(shí)例皆是對(duì)象，具體分為 原始類型 和 合成類型 ：
原始類型 對(duì)象指的是 Undefined 、 Null 、Boolean 、Number 和 String ，按值傳遞。
合成類型 對(duì)象指的是 array 、 object 以及 function ，按址傳遞，傳遞的時(shí)候是內(nèi)存中的地址。

克隆或者拷貝分為2種： 淺度克隆 、 深度克隆 。
淺度克隆 ：基本類型為值傳遞，對(duì)象仍為引用傳遞。
深度克隆 ：所有元素或?qū)傩跃耆寺?，并于原引用類型完全?dú)立，即，在后面修改對(duì)象的屬性的時(shí)候，原對(duì)象不會(huì)被修改。

又或許你剛聽(tīng)說(shuō)“深度克隆”這個(gè)詞，簡(jiǎn)單來(lái)說(shuō)，就是說(shuō)有個(gè)變量a，a的值是個(gè)對(duì)象（包括基本數(shù)據(jù)類型），現(xiàn)在你要?jiǎng)?chuàng)建一個(gè)變量b，使得它擁有跟a一樣的方法和屬性等等。但是a和b之間不能相互影響，即a的值的改變不影響b值的變化。直接賦值可好？

var a = 1;
var b = a;
a = 10;
console.log(b);            // 1
 
var a = "hello";
var b = a;
a = "world";
console.log(b);            // hello
 
var a = true;
var b = a;
a = false;
console.log(b);            // true

實(shí)踐證明某些 JavaScript 的原始數(shù)據(jù)類型，如果要克隆直接賦值即可。
關(guān)于 function 的深度復(fù)制：查閱了一些資料， function 的深度復(fù)制似乎和原始數(shù)據(jù)類型的深度復(fù)制一樣。

var a = function () {
    console.log(1);
};
var b = a;
a = function () {
    console.log(2);
};
b();                    // 1

本來(lái)我也是這么認(rèn)為的，直到文章下出現(xiàn)了評(píng)論。思考后我覺(jué)得 function 和普通的對(duì)象一樣，只是我們?cè)谄匠?yīng)用中習(xí)慣了整體的重新賦值，導(dǎo)致它在深度復(fù)制中的表現(xiàn)和原始類型一致：

var a = function () {
    console.log(1);
};
a.tmp = 10;
var b = a;
a.tmp = 20;
console.log(b.tmp);        // 20

于是乎對(duì)于 function 類型的深度克隆，直接賦值似乎并不應(yīng)該是一種最好的方法（盡管實(shí)際應(yīng)用中足矣）。

但是對(duì)象呢？

var a = [0,1,2,3];
var b = a;
a.push(4);
console.log(b);            // [0, 1, 2, 3, 4]

顯然與預(yù)期不符，為什么會(huì)這樣？因?yàn)樵紨?shù)據(jù)類型儲(chǔ)存的是對(duì)象的實(shí)際數(shù)據(jù)，而對(duì)象類型存儲(chǔ)的是對(duì)象的引用地址。上面的例子呢也就是說(shuō)a和b對(duì)象引用了同一個(gè)地址，無(wú)論改變a還是改變b，其實(shí)根本操作是一樣的，都是對(duì)那塊空間地址中的值的改變。

于是我們知道了，對(duì)于基本的對(duì)象來(lái)說(shuō)，不能只能用 “ = ” 賦值，思索后寫(xiě)下如下代碼：

// 判斷arr是否為一個(gè)數(shù)組，返回一個(gè)bool值
function isArray (arr) {
    return Object.prototype.toString.call(arr) === "[object Array]";  
}
// 深度克隆
function deepClone (obj) {  
    if(typeof obj !== "object" && typeof obj !== "function") {
        return obj;        //原始類型直接返回
    }
    var o = isArray(obj) ? [] : {}; 
    for(i in obj) {  
        if(obj.hasOwnProperty(i)){ 
            o[i] = typeof obj[i] === "object" ? deepClone(obj[i]) : obj[i]; 
        } 
    } 
    return o;
}

注意代碼中判斷數(shù)組的時(shí)候用的不是 obj instanceof Array ，這是因?yàn)樵摲椒ù嬖谝恍┬?wèn)題，詳情見(jiàn) http://www.nowamagic.net/librarys/veda/detail/1250

用一些代碼來(lái)測(cè)試下：

// 測(cè)試用例：
var srcObj = {
    a: 1,
    b: {
        b1: ["hello", "hi"],
        b2: "JavaScript"
    }
};
var abObj = srcObj;
var tarObj = cloneObject(srcObj);

srcObj.a = 2;
srcObj.b.b1[0] = "Hello";

console.log(abObj.a);
console.log(abObj.b.b1[0]);

console.log(tarObj.a);      // 1
console.log(tarObj.b.b1[0]);    // "hello"

似乎可以解決一般的對(duì)象（包括 Array ）的深度克隆了，或許這兒會(huì)有疑問(wèn)，new String(..) 這類的也是對(duì)象啊，可是這樣寫(xiě)你克隆不了啊…但是樓主覺(jué)得深度克隆的考點(diǎn)不在這里，可能在于：

原始數(shù)據(jù)類型的直接賦值

function的exception

對(duì)象的深度克隆中Array類型的判斷

克隆函數(shù)的遞歸調(diào)用

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/78783.html

相關(guān)文章

  • js對(duì)象詳解(JavaScript對(duì)象深度剖析，深度理解js對(duì)象)

    摘要：對(duì)象詳解對(duì)象深度剖析，深度理解對(duì)象這算是醞釀很久的一篇文章了。用空構(gòu)造函數(shù)設(shè)置類名每個(gè)對(duì)象都共享相同屬性每個(gè)對(duì)象共享一個(gè)方法版本，省內(nèi)存。 js對(duì)象詳解(JavaScript對(duì)象深度剖析，深度理解js對(duì)象) 這算是醞釀很久的一篇文章了。 JavaScript作為一個(gè)基于對(duì)象(沒(méi)有類的概念)的語(yǔ)言，從入門到精通到放棄一直會(huì)被對(duì)象這個(gè)問(wèn)題圍繞。 平時(shí)發(fā)的文章基本都是開(kāi)發(fā)中遇到的問(wèn)題和對(duì)...

    CatalpaFlat 評(píng)論0 收藏0

  • 如何深度克隆一個(gè)對(duì)象

    摘要：如何深度克隆一個(gè)對(duì)象在我們?nèi)粘９ぷ髦薪?jīng)常會(huì)遇到需要去克隆一個(gè)對(duì)象比如多個(gè)地方用到的公共的圖表基本參數(shù)的配置相信很多人會(huì)想到用和方法去克隆一個(gè)對(duì)象，這個(gè)可以明確告訴大家這些都是些不靠譜的淺度克隆。 如何深度克隆一個(gè)對(duì)象 在我們?nèi)粘９ぷ髦薪?jīng)常會(huì)遇到需要去克隆一個(gè)對(duì)象比如多個(gè)地方用到的公共的圖表基本參數(shù)的配置 相信很多人會(huì)想到用 Object.assign, JSON.stringify 和...

    TIGERB 評(píng)論0 收藏0

  • 淺拷貝與深拷貝

    摘要：二淺拷貝與深拷貝深拷貝和淺拷貝是只針對(duì)和這樣的引用數(shù)據(jù)類型的。淺拷貝是按位拷貝對(duì)象，它會(huì)創(chuàng)建一個(gè)新對(duì)象，這個(gè)對(duì)象有著原始對(duì)象屬性值的一份精確拷貝。對(duì)于字符串?dāng)?shù)字及布爾值來(lái)說(shuō)不是或者對(duì)象，會(huì)拷貝這些值到新的數(shù)組里。 一、數(shù)據(jù)類型 數(shù)據(jù)分為基本數(shù)據(jù)類型(String, Number, Boolean, Null, Undefined，Symbol)和對(duì)象數(shù)據(jù)類型。 基本數(shù)據(jù)類型的特點(diǎn)：直...

    hzc 評(píng)論0 收藏0

  • 淺拷貝與深拷貝

    摘要：二淺拷貝與深拷貝深拷貝和淺拷貝是只針對(duì)和這樣的引用數(shù)據(jù)類型的。淺拷貝是按位拷貝對(duì)象，它會(huì)創(chuàng)建一個(gè)新對(duì)象，這個(gè)對(duì)象有著原始對(duì)象屬性值的一份精確拷貝。對(duì)于字符串?dāng)?shù)字及布爾值來(lái)說(shuō)不是或者對(duì)象，會(huì)拷貝這些值到新的數(shù)組里。 一、數(shù)據(jù)類型 數(shù)據(jù)分為基本數(shù)據(jù)類型(String, Number, Boolean, Null, Undefined，Symbol)和對(duì)象數(shù)據(jù)類型。 基本數(shù)據(jù)類型的特點(diǎn)：直...

    史占廣 評(píng)論0 收藏0

  • JavaScript 深拷貝性能分析

    摘要：它接受任意數(shù)量的源對(duì)象，枚舉它們的所有屬性并分配給。所以現(xiàn)在怎么辦有幾種方法可以創(chuàng)建一個(gè)對(duì)象的深拷貝。為了防止發(fā)生任何意外，請(qǐng)使用而不是。我想測(cè)量哪種方法是最高性能的。圖表以下是，和中不同技術(shù)的性能。 原文：Deep-copying in JavaScript - DasSur.ma 如何在 JavaScript 中拷貝一個(gè)對(duì)象？對(duì)于這個(gè)很簡(jiǎn)單的問(wèn)題，但是答案卻不簡(jiǎn)單。 引用傳值 在...

    MyFaith 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<