亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

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

 更新時間:2013年01月09日 09:09:24   作者:  
今天整理了下資料,分析下為什么一句話可以實現(xiàn)純數(shù)據(jù)json對象的深度克隆,感興趣的朋友可以了解下哦
復(fù)制代碼 代碼如下:

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

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

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

從上面的介紹可以看出這個函數(shù)把一個對象或數(shù)組轉(zhuǎn)換成了一個json字符串。
2.JSON.parse函數(shù)
復(fù)制代碼 代碼如下:

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

從上面的介紹可以看出這個函數(shù)把一個json字符串轉(zhuǎn)換成了一個對象或數(shù)組。
3.示例
數(shù)組的克?。?
復(fù)制代碼 代碼如下:

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);

實驗結(jié)果

從上面的結(jié)果中我們發(fā)現(xiàn),確實深度克隆了一個數(shù)組。
對象的克隆
復(fù)制代碼 代碼如下:

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));

實驗結(jié)果
 
從上面的實驗我們發(fā)現(xiàn),這樣的方法也可以克隆對象。
4.但是上面所有的實驗都是針對純數(shù)據(jù)的,就是說,這種方法只在純數(shù)據(jù)的數(shù)組或者對象克隆中有效。
非純數(shù)據(jù)的實驗
復(fù)制代碼 代碼如下:

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));

實驗結(jié)果
 
從上面的實驗結(jié)果中可以看出,非純數(shù)據(jù)的函數(shù)不能參與到轉(zhuǎn)換中,它被“鄙視”了。
所以,這種一句話深度克隆的方法只針對于純數(shù)據(jù),這個是開發(fā)中需要注意的地方。

相關(guān)文章

  • JavaScript 中調(diào)用 Kotlin 方法實例詳解

    JavaScript 中調(diào)用 Kotlin 方法實例詳解

    這篇文章主要介紹了JavaScript 中調(diào)用 Kotlin 方法實例詳解的相關(guān)資料,需要的朋友可以參考下
    2017-06-06
  • 左右懸浮可分組的網(wǎng)站QQ在線客服代碼(可謂經(jīng)典)

    左右懸浮可分組的網(wǎng)站QQ在線客服代碼(可謂經(jīng)典)

    QQ在線客服在每一個web開發(fā)人員的記憶里都是一個經(jīng)典,既然是經(jīng)典,也就是必不可少,那就應(yīng)該很好的呈現(xiàn)出來,本文整理了一些左右懸浮可分組的網(wǎng)站QQ在線客服代碼,需要的朋友可以了解下
    2012-12-12
  • js event事件的傳遞與冒泡處理

    js event事件的傳遞與冒泡處理

    與Netscape相反,IE中的事件傳遞方向是從事情發(fā)生的對象開始,然后依次由該對象向所在的父節(jié)點傳遞。
    2009-12-12
  • 微信小程序圖片右邊加兩行文字的代碼

    微信小程序圖片右邊加兩行文字的代碼

    這篇文章主要介紹了微信小程序圖片右邊加兩行文字的代碼,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2020-04-04
  • 淺談JavaScript中的“!!”作用

    淺談JavaScript中的“!!”作用

    這篇文章主要介紹了淺談JavaScript中的“!!”作用,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-08-08
  • 用JS實現(xiàn)的一個include函數(shù)

    用JS實現(xiàn)的一個include函數(shù)

    用JS實現(xiàn)的一個include函數(shù)...
    2007-07-07
  • H5手機端多文件上傳預(yù)覽插件

    H5手機端多文件上傳預(yù)覽插件

    這篇文章主要為大家詳細介紹了H5圖片上傳插件,基于zepto,支持多文件上傳,進度和圖片預(yù)覽,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-04-04
  • 判斷iframe是否加載完成的完美方法

    判斷iframe是否加載完成的完美方法

    一般來說,我們判斷 iframe 是否加載完成其實與 判斷JavaScript 文件是否加載完成 采用的方法很類似
    2010-01-01
  • three.js中物體的燈光與陰影設(shè)置

    three.js中物體的燈光與陰影設(shè)置

    本文主要介紹了three.js中物體的燈光與陰影設(shè)置,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2023-07-07
  • javascript感應(yīng)鼠標圖片透明度顯示的方法

    javascript感應(yīng)鼠標圖片透明度顯示的方法

    這篇文章主要介紹了javascript感應(yīng)鼠標圖片透明度顯示的方法,涉及javascript針對鼠標事件及圖片透明度操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-02-02

最新評論