一文看懂JS的強拷貝和深拷貝

有些易混的點確實需要拿出來好好數落一下。拷貝就是乙個必須要盤點的問題。

首先看看啥時候會用到拷貝。簡單地說，拷貝可以說是無處不在，甚至我們最熟悉的圓形操作都是在不斷地拷貝。更實際一點，拿react來說，如果你對拷貝理解不清的話，類元件形式的react你是沒法寫的，雖說函式元件出現之後這種情況好了許多，但是redux這個東西你還是逃不了的，不了解拷貝你甚至都看不懂redux的寫法。

在這裡，關於應用類似和值型別這裡就不多說了，這些是看懂這篇文章的基礎。

但是賦值是要說一下的。

let a =[1

,2]let b = a
a===b

而淺拷貝雖然可以複製乙個新的物件，但是如果物件中又存在引用型別的話，他是無能為力的：

>

let a =
}undefined
> a
}>
let b = a
undefined
> b.fir.first =
'4''4'
> a
}>
let c = object.
assign
(,a)
undefined
> c
}> c.name =
'd''d'
> c
}> a
}> c.fir.first =
'5''5'
> c
}> a
}

這是因為我們使用的淺拷貝，即object.assign，包括concat和slice方法，執行的都是淺拷貝。

對於深拷貝，大家最熟悉的就是json.stringify和json.parse。

> b =

json
.stringify
(a)'}'
> c =
json
.parse
(b)}
> a
}> a.fir.first =
'6''6'
> a
}> c
}

插個題外話，這裡有個工具是用來檢視immutable資料的，我們知道immutable最大的缺點就是難以除錯，有這個的話會方便很多。

咳咳扯遠了，那麼redux為什麼需要深拷貝的資料呢？

redux 和 react-redux 都使用了淺比較。具體來說：

redux 的 combinereducers 方法 淺比較 它呼叫的 reducer 的引用是否發生變化。

react-redux 的 connect 方法生成的元件通過 淺比較根 state 的引用變化 與 mapstatetoprops 函式的返回值，來判斷包裝的元件是否需要重新渲染。 以上淺比較需要不變性才能正常工作

JS深拷貝和淺拷貝

js中物件分為基本型別和復合 引用 型別，基本型別存放在棧記憶體，復合 引用 型別存放在堆記憶體中 堆記憶體中用於存放由new建立的物件，棧記憶體存放一些基本型別的變數和物件的引用變數 對於簡單變數，記憶體小，直接複製不會發生引用 var a 123 var b a a 123456 console...

JS淺拷貝和深拷貝

1.淺拷貝 copy var obj1 物件存放於堆記憶體中,物件中的鍵值對,值可以為物件,可以為陣列.var obj2 obj1 物件,陣列之間只有引用賦值 obj2.name 撒哈哈 當改動物件obj2的時候,obj1的key對應的value也會更改這是淺拷貝 深拷貝 var obj1 var ...

js深拷貝和淺拷貝

走在前端的大道上 var m var n m n.a 15 這時m.a的值是多少 m.a會輸出15，因為這是淺拷貝，n和m指向的是同乙個堆，物件複製只是複製的物件的引用。深拷貝和上面淺拷貝不同，就是徹底copy乙個物件，而不是copy物件的引用，例如，還是之前的例子，我們這麼寫 var m var ...