最近在學(xué)習(xí)JavaScript苦蒿，學(xué)習(xí)過(guò)程中發(fā)現(xiàn)了一個(gè)例程中使用了Object.assign來(lái)進(jìn)行對(duì)象的拷貝儿捧。于是自己做了一個(gè)小測(cè)試漏设，發(fā)現(xiàn)了如下的問(wèn)題墨闲。
example 1:
var a = 0;
var b = a;
console.log(a); // => 0
console.log(b); // => 0
b = 1;
console.log(a); // => 0
console.log(b); // => 1
如上，第一次打印輸出,a和b都為0郑口，b賦值為1后再打印輸出鸳碧，a不變盾鳞，b為1。
example 2:
var a = {x : 0};
var b = a;
console.log(a); // => { x: 0}
console.log(b); // => { x: 0}
b.x = 1;
console.log(a); // => { x: 1}
console.log(b); // => { x: 1}
如上瞻离，第一次打印輸出腾仅，a和b都為{ x: 1}，第二次打印輸出套利，a和b都為{ x: 1}
至此推励，問(wèn)題已經(jīng)體現(xiàn)出來(lái)了：
當(dāng)a和b都是數(shù)字時(shí)，b的改變不會(huì)影響到a日裙；
當(dāng)a和b都是對(duì)象時(shí)吹艇，b的改變?cè)斐闪薬的改變。
我們?cè)谶M(jìn)行這兩個(gè)程序編程時(shí)昂拂，都會(huì)意識(shí)到以下兩點(diǎn)：
- 我們將a拷貝給了b
- 我們改變了b
但是我們沒(méi)考慮到的是受神，在example 2中，a受到了b的影響格侯，這顯然不是我們期望得到的結(jié)果鼻听。
而以上所提及的，就是深拷貝和淺拷貝的區(qū)別联四。以下撑碴，我們先對(duì)深拷貝和淺拷貝做一個(gè)理解。
淺拷貝Shallow Copy朝墩，是按位拷貝對(duì)象醉拓，它會(huì)創(chuàng)建一個(gè)新對(duì)象，這個(gè)對(duì)象有著原始對(duì)象屬性值的一份精確拷貝收苏。如果屬性是基本類型亿卤，拷貝的就是基本類型的值；如果屬性是內(nèi)存地址（引用類型）鹿霸，拷貝的就是內(nèi)存地址 排吴，因此如果其中一個(gè)對(duì)象改變了這個(gè)地址，就會(huì)影響到另一個(gè)對(duì)象懦鼠。
深拷貝Deep Copy钻哩，會(huì)拷貝所有的屬性,并拷貝屬性指向的動(dòng)態(tài)分配的內(nèi)存。當(dāng)對(duì)象和它所引用的對(duì)象一起拷貝時(shí)即發(fā)生深拷貝肛冶。深拷貝相比于淺拷貝速度較慢并且花銷較大街氢。
也就是說(shuō)，深拷貝是開(kāi)辟了新的內(nèi)存空間來(lái)接受目標(biāo)睦袖，而淺拷貝是把目標(biāo)映射到了原來(lái)的內(nèi)存上了阳仔。所以，當(dāng)使用淺拷貝時(shí)，兩個(gè)參數(shù)實(shí)際只是一處地址的兩個(gè)別名近范，改變?nèi)我鈪?shù)，實(shí)際改變的是對(duì)應(yīng)地址內(nèi)存中的數(shù)據(jù)延蟹，就會(huì)造成另一個(gè)同樣指向這個(gè)地址的參數(shù)评矩。
我發(fā)現(xiàn)在JavaScript、C++阱飘、java等語(yǔ)言中都會(huì)有深拷貝和淺拷貝的概念斥杜。在我看來(lái)究其原因就是為了所謂的安全操作而摒棄了指針這個(gè)概念。在有指針概念的語(yǔ)言沥匈，比如C語(yǔ)言中蔗喂，會(huì)出現(xiàn)以下的賦值語(yǔ)句：
int a = 5;
int b = a;
int* p = &a;
不難看出的是：
第一條語(yǔ)句中，聲明并定義了a高帖，聲明a為整型缰儿，開(kāi)辟了內(nèi)存空間，并將5賦值給a散址；
第二條語(yǔ)句中乖阵，聲明并定義了b，聲明b為整型预麸，開(kāi)辟了內(nèi)存空間瞪浸，并將a=5賦值給b；
第三條語(yǔ)句中吏祸，聲明并定義了指針p对蒲，聲明p為一個(gè)指針，開(kāi)辟了內(nèi)存空間贡翘，并將a的地址賦給了p蹈矮。
這樣，我們操作b時(shí)床估，實(shí)際上時(shí)和a沒(méi)有任何關(guān)系的含滴，因?yàn)楸旧砭褪莾商巸?nèi)存。而進(jìn)行諸如
p = 10的操作時(shí)丐巫，實(shí)際上是在操作和a所對(duì)應(yīng)的同一處內(nèi)存谈况，這樣a的值也就發(fā)生了改變。而類似javaScript語(yǔ)言在進(jìn)行拷貝操作時(shí)递胧，為了其性能碑韵，會(huì)把比較復(fù)雜的對(duì)象的拷貝默認(rèn)為淺拷貝，也就是類似上述的第三條語(yǔ)句的操作缎脾，只是簡(jiǎn)單的做了一個(gè)地址的映射祝闻，這樣就導(dǎo)致了文章開(kāi)頭example 2中出現(xiàn)的問(wèn)題。
那么在javaScript中，如何進(jìn)行對(duì)象的深拷貝联喘？
第一種华蜒，最簡(jiǎn)單粗暴的方法，由于當(dāng)進(jìn)行數(shù)字這種簡(jiǎn)單的類型的拷貝使用的是深拷貝豁遭，那么我們就先給目標(biāo)開(kāi)辟一個(gè)空間叭喜，然后手動(dòng)的將所有值都提取出來(lái)并一一對(duì)應(yīng)：
var a = {x : 0, y : 0};
var b = {};
b.x = a.x;
b.y = a.y;
console.log(a); // => { x: 0, y : 0}
console.log(b); // => { x: 0, y : 0}
b.x = 1;
console.log(a); // => { x: 0, y : 0}
console.log(b); // => { x: 1, y : 0}
第二種，在ES6中提供了Object.assign蓖谢，也就是開(kāi)頭提到的方法捂蕴，來(lái)完成深拷貝：
var a = {x : 0, y : 0};
var b = Object.assign({}, a);
console.log(a); // => { x: 0, y : 0}
console.log(b); // => { x: 0, y : 0}
b.x = 1;
console.log(a); // => { x: 0, y : 0}
console.log(b); // => { x: 1, y : 0}
深拷貝是一個(gè)重要的也是比較難的部分，這里只是為了解釋深拷貝和淺拷貝闪幽，沒(méi)有對(duì)深拷貝實(shí)現(xiàn)做太多工作啥辨。有需要和興趣的可以自己找找資料。
