JavaScript深拷貝和淺拷貝

2021-09-23 01:45:09 字數 1205 閱讀 9701

我們在專案開發過程中經常會拿到乙個資料後需要拷貝乙份副本出來進行操作,而且會發現在很多前端框架中都是拷貝乙份操作的,那麼這就涉及到了 js 中對資料的深淺拷貝問題,所謂深淺拷貝,淺拷貝的意思就是,你只是複製了物件資料的引用,並沒有把記憶體裡的值另外複製乙份,那麼深拷貝就是把值完整地複製乙份新的值。

那麼深拷貝,淺拷貝的區別是什麼呢?先給結論:

操作拷貝之後的資料不會影響到原資料的值拷貝,就是深拷貝,反正,有影響則為淺拷貝。

一、應用場景

日常開發中,js 拷貝大多會在 資料儲存,資料比對,資料同步 時出現,所以,當你在這些場景的時候,要記得裡面隱藏有乙個資料深淺拷貝的問題。

二、淺拷貝

function clone(origin) ;

for (var prop in origin)

}return result;var jay = var otherjay = clone(jay);

otherjay.age = 18;

otherjay.family.wife = 「othergirl」;

console.log(jay);

// name: 「jaychou」,

// age: 40, // 沒被改變

// family: ,origin)// 5、 物件淺拷貝 - 擴充套件運算子

// 擴充套件運算子(…)用於取出引數物件的所有可遍歷屬性,拷貝到當前物件之中

function shallowcopy5(origin) object.assign 的拷貝,假如源物件的屬性值是乙個指向物件的引用,它也只拷貝那個引用值。mdn 有相應的例項和解釋。

三、深拷貝

深拷貝就完整複製資料的值(而非引用),目的在於避免拷貝後資料對原資料產生影響。

// 1. 深拷貝 - json 正反序列化

// 缺點就是無法拷貝 undefined、function、symbol 這類特殊的屬性值。

function deepclone1(origin) ;

for (let keys in origin) ;

// 如果是引用資料型別,會遞迴呼叫

result[keys] = deepclone(origin[keys]);

} else

}return result;

js 的深拷貝的應用,需要根據你的使用場景進行使用,首先是有無必要深拷貝,其次是資料型別,是否直接使用 json 的 api 其實就可以。

javascript 淺拷貝和深拷貝

簡單的賦值就是淺拷貝。因為物件和陣列在賦值的時候都是引用傳遞。賦值的時候只是傳遞乙個指標。看下面的例項 var a 1,2,3 var b a var test var c test console.log a console.log b console.log test console.log b...

JavaScript深拷貝 淺拷貝

淺拷貝 淺拷貝只是複製了記憶體位址,如果原位址中的物件改變了,淺拷貝出來的物件也會相應改變。深拷貝 開闢了一塊新的記憶體存放位址和位址指向的物件,原位址的任何物件改變了,深拷貝出來的物件不變。淺拷貝陣列 只拷貝第一級陣列 1.直接遍歷var arr 1,2,3,4 function copy arg...

javaScript淺拷貝 深拷貝

資料型別 js的資料型別有兩種 1.基本資料型別 數值 字串 布林 null undefined 值型別 存放在棧中,所以複製基本資料型別的值是會新開乙個棧記憶體 淺拷貝 如果我們要複製物件的所有屬性都不是引用型別時,就可以使用淺拷貝,實現方式就是遍歷並複製,最後返回新的物件。深拷貝 深度拷貝就是把...