JS引用類型數據的淺拷貝與深拷貝

MangoGoing 發布于2019-08-21 16:53 / 1684人閱讀

摘要：拷貝到，屬性均順利拷貝。大輝小輝，小輝，大輝小輝，小輝，大輝但是，若修改的屬性變為對象或數組時，那么對象之間就會發生關聯。深拷貝不希望對象之間產生關聯，那么這時候可以用到深拷貝。

淺拷貝

之前文章提到，在定義一個對象或數組時，變量存放的往往只是一個地址。當我們對堆內存中的對象復制時，如果屬性是對象或數組時，這時候我們拷貝的只是一個棧內存的指針。因此b對象在訪問該屬性時，會根據指針尋找到a對象指向的堆內存對象，兩者的屬性值會指向同一內存空間。

var a = {
    key1:"11111"
}
function Copy(p) {
    var c = {};
    for (var i in p) { 
    　　c[i] = p[i];
    }
    return c;
}
a.key2 = ["小輝","小輝"];
var b = Copy(a);
b.key3 = "33333";
alert(b.key1);     //1111111
alert(b.key3);    //33333
alert(a.key3);    //undefined
//對象中key1屬性是字符串，key2屬性是數組。a拷貝到b，12屬性均順利拷貝。給b對象新增一個字符串類型的屬性key3時，b能正常修改，而a中無定義。說明子對象的key3（基本類型）并沒有關聯到父對象中，所以undefined。

b.key2.push("大輝");
alert(b.key2);    //小輝，小輝，大輝
alert(a.key2);    //小輝，小輝，大輝

但是，若修改的屬性變為對象或數組時，那么對象之間就會發生關聯。從以上彈出結果可知，對b對象進行修改，a、b的key2屬性值（數組）均發生了改變。其在內存的狀態，可以用下圖來表示。

深拷貝

不希望對象之間產生關聯，那么這時候可以用到深拷貝。既然屬性值類型是數組和或對象時只會傳址，那么我們就用遞歸來解決這個問題，把要復制的對象中所有屬于對象的屬性類型都遍歷賦給新對象即可。

function Copy(p, c) {
    var c = c || {};
    for (var i in p) {
    　　if (typeof p[i] === "object") {
    　　　　　c[i] = (p[i].constructor === Array) ? [] : {};
    　　　　　Copy(p[i], c[i]);
    　　} else {
    　　　　　c[i] = p[i];
    　　}
    }
    return c;
    }    
a.key2 = ["小輝","小輝"];
var b={};
b = Copy(a,b);        
b.key2.push("大輝");
alert(b.key2);    //小輝，小輝，大輝
alert(a.key2);    //小輝，小輝

過程如下圖

GPU云服務器云服務器 js拷貝內存數據庫 js引用數據類型 js引用的數據類型 js引用json文件數據類型

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/88870.html

JavaScript中的淺拷貝與深拷貝

摘要：所以，深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象，改變源對象不會對得到的對象有影響。為什么會有淺拷貝與深拷貝什么是淺拷貝與深拷貝如何實現淺拷貝與深拷貝好了，問題出來了，那么下面就讓我們帶著這幾個問題去探究一下吧！如果文章中有出現紕漏、錯誤之處，還請看到的小伙伴多多指教，先行謝過以下↓ 數據類型在開始了解淺拷貝與深拷貝之前，讓我們先...

546669204 2019-08-26 18:27 評論0 收藏0
JavaScript中的淺拷貝與深拷貝

摘要：所以，深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象，改變源對象不會對得到的對象有影響。上一篇 JavaScript中的繼承前言文章開始之前，讓我們先思考一下這幾個問題：為什么會有淺拷貝與深拷貝什么是淺拷貝與深拷貝如何實現淺拷貝與深拷貝好了，問題出來了，那么下面就讓我們帶著這幾個問題去探究一下吧！如果文章中有出現紕漏、錯誤之處...

AZmake 2019-08-23 17:08 評論0 收藏0
關于js的淺拷貝與深拷貝

摘要：原文地址淺拷貝和深拷貝只針對像這樣的復雜對象的簡單來說，淺拷貝只拷貝一層對象的屬性，而深拷貝則遞歸拷貝了所有層級。淺拷貝通過來實現淺拷貝。原文地址：http://www.silenceboy.com/201... 淺拷貝和深拷貝只針對像Object, Array這樣的復雜對象的.簡單來說，淺拷貝只拷貝一層對象的屬性，而深拷貝則遞歸拷貝了所有層級。淺拷貝通過 Object.ass...

summerpxy 2019-08-26 13:41 評論0 收藏0
淺談JavaScript的淺拷貝與深拷貝

摘要：引用數據類型是存放在堆內存中的，變量實際上是一個存放在棧內存的指針，這個指針指向堆內存中的地址。棧和堆的區別其實淺拷貝和深拷貝的主要區別就是數據在內存中的存儲類型不同。這里，對存在子對象的對象進行拷貝的時候，就是深拷貝了。數據類型在開始拷貝之前，我們從JavaScript的數據類型和內存存放地址講起。數據類型分為基本數據類型和引用數據類型基本數據類型主要包括undefin...

娣辯孩 2019-08-23 13:44 評論0 收藏0
關于JavaScript的淺拷貝和深拷貝

摘要：引用類型值引用類型值是保存在堆內存中的對象，變量保存的只是指向該內存的地址，在復制引用類型值的時候，其實只復制了指向該內存的地址。前言要理解 JavaScript中淺拷貝和深拷貝的區別，首先要明白JavaScript的數據類型。JavaScript有兩種數據類型，基礎數據類型和引用數據類型。js的基本類型：undefined，null，string，boolean，number,s...

shenhualong 2019-08-26 12:23 評論0 收藏0