JavaScript 如何完整實現深度Clone物件?

時間 2021-05-05 17:14:55

1樓:曹上

//deep copy深拷貝

vardeepCopy

=function

(obj

)for

(leti=

0;i<

keys

.length;i

++)else

}return

newObject

}我試著寫了乙個,不知道給不給力。

2樓:李雪強

似乎是個哲學問題, 到底能不能造出兩片相同的葉子, 似乎很簡單, 但是如果兩片葉子要相同, 就要生長的樹枝也一樣, 然後不斷地轉殖......, 最後是平行的宇宙.

3樓:李剛

(function(define, global) { 'use strict';

define(function () {

return function(des, src, map){

if(typeof des !== 'object'

&& typeof des !== 'function'){

throw new TypeError('Unable to enumerate properties of '+ desif(typeof src !== 'object'

&& typeof src !== 'function'){

throw new TypeError('Unable to enumerate properties of '+ srcmap = map || function(d, s, i, des, src){

//這裡要加乙個des[i],是因為要照顧一些不可列舉的屬性

if(!(des[i] || (i in desreturn sreturn dif(map === true){ //override

map = function(d,s){

return sfor (var i in src) {

des[i] = map(des[i], src[i], i, des, src);

//如果返回undefined,嘗試刪掉這個屬性

4樓:楊匡

用JQuery

// Shallow copy

var newObject = jQuery.extend({}, oldObject);

// Deep copy

var newObject = jQuery.extend(true, {}, oldObject);

5樓:Leon

Clojurescript (GitHub - clojure/clojurescript: Clojure to JS compiler)

Persistent data structure,強大到沒朋友~~

6樓:Twiknight

如果你想clone所有的東西,那麼:

edge case太多

大家關於什麼是deep clone也沒有個共識所以很難搞。

但是有一種比較取巧的方法:

clone

=function

(item

:ICloneable

)只允許你clone實現了ICloneable的物件,至於怎麼clone,取決於這個物件本身如何定義clone。

這樣就避開了我上面所說的兩個問題。

這樣,你說的帶上原型鏈完全不是問題,比如:

class

Aclone()}

同時還有乙個額外的好處:

當為某種case實現clone很困難或者很彆扭的時候,你就該考慮自己的設計是不是有問題了。

當然,這個做法有乙個也有個蛋疼的問題:

class

Aclone()}

class

BextendsA}

clone

(new

B())

// wtf?

7樓:尤雨溪

第一,如 @賀師俊 所說,你對於你想要的 deep clone 的語義表達得並不清楚,任意物件的深度轉殖,edge case 非常多,比如原生 DOM/BOM 物件怎麼處理,RegExp 怎麼處理,函式怎麼處理,原型鏈怎麼處理... 並不是乙個簡單的問題。

第二,你說這個在任何乙個 lib/framework 都會用到,但是能滿足你這個需求的我從來沒在任何框架原始碼裡見過。

第三,大部分時候 deep clone 的用例都是在資料結構的持久化上,換句話說應該是可以被序列化/反序列化的資料。資料型別只包含 JSON 支援的型別的話就好辦了,加上迴圈引用支援就行了。這個需求可以用我寫的 GitHub - yyx990803/circular-json-es6:

circular JSON.stringify and JSON.parse, for environments with native ES6 Map

8樓:三喵

正好在這方面有些疑問,js裡函式也是物件,因此轉殖物件也要包括轉殖函式。那麼,瀏覽器內建函式怎麼轉殖,比如setTimeout;用了硬繫結的函式,怎麼處理

9樓:賀師俊

clone不是那麼好實現的。

但比實現更難的是,你首先需要精確的定義語義,比如怎麼處理原型?哪些物件是不可以clone的?

反而是題主講的IE相容問題都是小事情,不需要糾纏。

我一般建議使用 lodash 實現的 https://lodash.com/docs#

cloneDeep

,其實現了The structured clone algorithm,因此語義也有清楚的定義,具體請自己看文件。注意lodash也提供了 cloneDeepWith 可以 customize 特殊物件的拷貝行為。不過 lodash 的實現並不會複製原型,只是複製原型上的屬性。

實際上,上述這些clone其主要目的(即滿足的use cases)是資料物件的傳遞,比如postMessage傳送,而不是用於一般的物件複製。因為複雜物件本身可能有很多約束,這不是乙個通用的clone可以搞定的。比如dom元素的複製必須使用cloneNode方法,且它也只處理dom自己的東西,如果你在乙個dom物件上隨便寫個屬性,clone出來的新物件上也沒有這個屬性。以上。

10樓:yibuyisheng

自己實現乙個物件的深度遍歷就行了,我大致羅列一下我想到的需要注意的點吧:

1、物件中存在迴圈引用。

2、無法處理非enumerable的屬性。

3、如果希望保持原型鏈的話,注意使用hasOwnProperty和getPrototypeOf。

《JavaScript悟道》中的數值字面量實際是如何儲存的?

貘吃饃香 路過為啥標準上不會規定?那麼字面值不被處理如何參與程式運算呢 所以還是好好看看 ES 規範裡 12.8.3 Numeric Literals 12.8.3.2 Static Semantics MV 12.8.3.3 Static Semantics NumericValue 5.2.5 ...

如何使用 JavaScript 獲取頁面 視窗的高度?

視窗尺寸 var windowWidth Math.max document.documentElement.clientWidth,window.innerWidth var windowHeight Math.max document.documentElement.clientHeight,w...

如何形成完整證據鏈?

上個學期學了Forensic Science的課,了解了一些基礎知識。這裡大概說一下。李昌鈺博士在他的 Henry Lee s Crime Scene Handbook中提出了Linkage Theory。Four way Linkage Theory有四個重要元素物證 嫌疑人 被害人以及犯罪現場。...