今天看es6的時候忽然想到一個問題就是針對於js的深拷貝和淺拷貝的問題，其實說直接點那，就是深複製和淺複製只針對像 Object, Array 這樣的複雜物件的。簡單來說，淺複製只複製一層物件的屬性，而深複製則遞迴複製了所有層級。

因為淺複製只會將物件的各個屬性進行依次複製，並不會進行遞迴複製，而 JavaScript 儲存物件都是存地址的，所以淺複製會導致 obj.arr 和 shadowObj.arr 指向同一塊記憶體地址，大概的示意圖如下。

舉一個列子哈：

let obj = { a:11, b: [22,33] };

function objCopy(src) {
let dst 
 
= {};
    for (let prop in src) {
if (src.hasOwnProperty(prop)) {
dst[prop] = src[prop];
        }
    }
return dst;
}
let _copy = objCopy(obj);

因為淺複製只會將物件的各個屬性進行依次複製，並不會進行遞迴複製，而 JavaScript 儲存物件都是存地址的，所以淺複製會導致 obj.b和 

_copy.b 指向同一塊記憶體地址，大概的示意圖如下。

導致的結果就是這樣：

_copy.arr[1] = 88;
obj.b[1]   // = 88

而深複製則不同，它不僅將原物件的各個屬性逐個複製出去，而且將原物件各個屬性所包含的物件也依次採用深複製的方法
 
遞迴複製到新物件上。這就不會存在上面 obj 和 _copy的 b屬性指向同一個物件的問題。

深拷貝要實現的效果是這樣的：

實現深拷貝的方法如下

最簡單的深拷貝，拿好：

b = JSON.parse( JSON.stringify(a) )

不過這有侷限性：

• 無法複製函式
• 原型鏈沒了，物件就是object，所屬的類沒了。

但是簡單，大多時候完全可以滿足需求了

jQuery.extend(true, { a : { a : "a" } }, { a : { b : "b" } } );
jQuery.extend( { a : { a
 
 : "a" } }, { a : { b : "b" } } );

（陣列深拷貝）

var arr = ["One","Two","Three"];
var arrtoo = arr.slice(0);
arrtoo[1] = "middle";
document.writeln("陣列的原始值：" + arr + "<br />");//Export:陣列的原始值：One,Two,Three
document.writeln("陣列的新值：" + arrtoo + "<br />");//Export:陣列的新值：One,middle,Three

concat() 方法用於連線兩個或多個數組。
該方法不會改變現有的陣列，而僅僅會返回被連線陣列的一個副本。
語法
arrayObject.concat(arrayX,arrayX,......,arrayX)
說明
返回一個新的陣列。該陣列是通過把所有 arrayX 引數新增到 arrayObject 中生成的。如果要進行 concat() 操作的引數是陣列，那麼新增的是陣列中的元素，而不是陣列。

（物件深拷貝）

就是把物件的屬性遍歷一遍，賦給一個新的物件。

}

var cloneObj = function(obj){
    var str, newobj = obj.constructor === Array ? [] : {};
    if(typeof obj !== 'object'){
        return;
    } else if(window.JSON){
        str = JSON.stringify(obj), //系列化物件
        newobj = JSON.parse(str); //還原
    } else {
        for(var i in obj){
            newobj[i] = typeof obj[i] === 'object' ? 
            cloneObj(obj[i]) : obj[i]; 
        }
    }
    return newobj;
};

小弟水平有限，大神勿噴，理解不對的地方請批評指正。謝謝~~