也不知道從什麼時候開始，前端圈冒出了個新詞：對象深度克隆。看起來好像很高大上的樣子，實際上並不新鮮，在我們的實際項目開發中，你可能早已用到，只不過由於漢字的博大精深，有些原本很簡單的事物被一些看似專業的詞匯稍加修飾，就變得神秘起來了。
首先為什麼要將一個對象進行深克隆？請允許我進行一個猜測：你有時一定會認為js的內置對象document太長，那麼你可能會這樣做：
復制代碼 代碼如下:
var d = document;
d.by = function(id){
return d.getElementById(id);
};
d.by('id').innerHTML = 'hello sentsin';
上述代碼對document.getElementById進行了簡化，同時在原document對象中也增加了一個by的成員方法，你可以通過document.hasOwnProperty('by')返回的狀態值來驗證你的判斷。再看下面一個例子。
復制代碼 代碼如下:
var person = {name: '賢心', profession: '前端開發', place: '杭州'};
var newPerson = person;
newPerson.age = '24';
console.log(person);
//結果：{name: '賢心', profession: '前端開發', place: '杭州', age: 24}
由此可見，將一個對象通過簡單的傳遞給一個新的變量時，僅僅只是給該對象增添了一個別名。這意味著，通過對該別名的操作，原有對象鍵值會發生改變。但問題在於，有時我們希望newPerson完全獨立於person，彼此之間不存在同步關系，那麼就需要生成一個副本，請看例子：
復制代碼 代碼如下:
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;
};
//測試
var obj = {a: 0, b: 1, c: 2};
var arr = [0, 1, 2];
//執行深度克隆
var newobj = cloneObj(obj);
var newarr = cloneObj(arr);
//對克隆後的新對象進行成員刪除
delete newobj.a;
newarr.splice(0,1);
console.log(obj, arr, newobj, newarr);
//結果： {a: 0, b: 1, c: 2}, [0, 1, 2], {b: 1, c: 2}, [1, 2];
這便是所謂的對象克隆。不過有幾處需要解釋一下。代碼中的JSON對象及其成員方法stringify和parse屬於ECMAScript5規范，它們分別負責將一個對象（包括數組對象）轉換成字符串，和還原，從而實現對象的深拷貝。那麼對於低級浏覽器（如IE），拷貝數組的話，可以用newobj.concat(obj)，而普通對象，就索性枚舉賦值好了。