一行代碼實現(xiàn)純數(shù)據(jù)json對象的深度克隆實現(xiàn)思路

更新時間：2013年01月09日 09:09:24 作者：

今天整理了下資料，分析下為什么一句話可以實現(xiàn)純數(shù)據(jù)json對象的深度克隆,感興趣的朋友可以了解下哦

復制代碼代碼如下:

var dataObjCloned=JSON.parse(JSON.stringify( dataObj ))

這是昨天晚上從大城小胖的微博上看到的，當時很感興趣，就mark了下。
今天整理了下資料，分析下為什么一句話可以實現(xiàn)純數(shù)據(jù)json對象的深度克隆。
1.JSON.stringify函數(shù)

復制代碼代碼如下:

 
將 JavaScript 值轉換為 JavaScript 對象表示法 (Json) 字符串。 
JSON.stringify(value [, replacer] [, space]) 
參數(shù) 
value 
必需。 要轉換的 JavaScript 值（通常為對象或數(shù)組）。 
replacer 
可選。 轉換結果的函數(shù)或數(shù)組。 
如果 replacer 為一個函數(shù)，則 JSON.stringify 會調用該函數(shù)，并傳入每個成員的鍵和值。 使用返回值而不是原始值。 如果此函數(shù)返回 undefined，則排除成員。 根對象的鍵是一個空字符串：""。 
如果 replacer 為一個數(shù)組，則僅轉換該數(shù)組中具有鍵值的成員。 成員的轉換順序與鍵在數(shù)組中的順序一樣。 當 value 參數(shù)也為數(shù)組時，將忽略 replacer 數(shù)組。 
space 
可選。 向返回值 JSON 文本添加縮進、空白和換行符以使其更易于讀取。 
如果省略 space，則將生成返回值文本，而沒有任何額外空白。 
如果 space 為一個數(shù)字，則返回值文本在每個級別縮進指定數(shù)目的空格。 如果 space 大于 10，則文本縮進 10 個空格。 
如果 space 是非空字符串（例如“\t”），則返回值文本在每個級別中縮進字符串中的字符數(shù)。 
如果 space 是長度大于 10 個字符的字符串，則使用前 10 個字符。 
返回值 
一個包含 JSON 文本的字符串。 

從上面的介紹可以看出這個函數(shù)把一個對象或數(shù)組轉換成了一個json字符串。
2.JSON.parse函數(shù)

復制代碼代碼如下:

 
將 JavaScript 對象表示法 (Json) 字符串轉換為對象。 
JSON.parse(text [, reviver]) 
參數(shù) 
text 
必需。 一個有效的 JSON 字符串。 
reviver 
可選。 一個轉換結果的函數(shù)。 將為對象的每個成員調用此函數(shù)。 如果成員包含嵌套對象，則先于父對象轉換嵌套對象。 對于每個成員，會發(fā)生以下情況： 
•如果 reviver 返回一個有效值，則成員值將替換為轉換后的值。 
•如果 reviver 返回它接收的相同值，則不修改成員值。 
•如果 reviver 返回 null 或 undefined，則刪除成員。 
返回值 
一個對象或數(shù)組。 

從上面的介紹可以看出這個函數(shù)把一個json字符串轉換成了一個對象或數(shù)組。
3.示例
數(shù)組的克?。?

復制代碼代碼如下:

 
var obj = [1,2,[3,4,5]]; 
var objCloned = JSON.parse(JSON.stringify(obj)); 
console.log(obj); 
console.log(JSON.stringify(obj)); 
console.log(objCloned); 
objCloned[0] = 6; 
console.log(obj); 
console.log(objCloned); 

實驗結果：

從上面的結果中我們發(fā)現(xiàn)，確實深度克隆了一個數(shù)組。
對象的克隆：

復制代碼代碼如下:

 
var obj = {name:'rey',info:{location:'beijing',age:'28'}}; 
var objCloned = JSON.parse(JSON.stringify(obj)); 
console.log(obj); 
console.log(JSON.stringify(obj)); 
console.log(objCloned); 
console.log(JSON.stringify(objCloned)); 
objCloned.name = 'luopan'; 
console.log(obj); 
console.log(JSON.stringify(obj)); 
console.log(objCloned); 
console.log(JSON.stringify(objCloned)); 

實驗結果：

從上面的實驗我們發(fā)現(xiàn)，這樣的方法也可以克隆對象。
4.但是上面所有的實驗都是針對純數(shù)據(jù)的，就是說，這種方法只在純數(shù)據(jù)的數(shù)組或者對象克隆中有效。
非純數(shù)據(jù)的實驗：

復制代碼代碼如下:

 
var obj = {name:'rey',info:{location:'beijing',age:'28'},hello:function(){console.log('hello world!');}}; 
var objCloned = JSON.parse(JSON.stringify(obj)); 
console.log(obj); 
console.log(JSON.stringify(obj)); 
console.log(objCloned); 
console.log(JSON.stringify(objCloned)); 
objCloned.name = 'luopan'; 
console.log(obj); 
console.log(JSON.stringify(obj)); 
console.log(objCloned); 
console.log(JSON.stringify(objCloned)); 

實驗結果：