詳解jQuery的拷貝對象
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="jquery.min.js"></script> <script> $(function() { //1, 普通拷貝,默認(rèn)為淺拷貝 var targetObj = {}; var obj = { id: 1, name: "andy" }; $.extend(targetObj, obj); //拷貝語法,把obj內(nèi)的屬性和屬性值拷貝給targetObj一個(gè)空對象 console.log(targetObj); //輸出結(jié)果是 obj對象里面的內(nèi)容 //2. 拷貝對象里面有屬性和屬性值情況下 var targett = { id: 0, gshg: 55 }; var objrr = { id: 1, name: "andy" }; $.extend(targett, objrr); console.log(targett); // 如果拷貝對象targett里面屬性和被拷貝對象objrr里面屬性有相同的,則objrr里面屬性值會(huì)覆蓋掉targett里面屬性值 //如果拷貝對象targett里面有屬性與被拷貝對象objrr里面屬性名不相同的不會(huì)被覆蓋,被拷貝對象objrr里面屬性只會(huì)后來居上 //3. 拷貝對象里面有對象情況下,淺拷貝 var taytuj = { id: 0, msg: { sex: '男' } }; var rete = { id: 1, name: "andy", msg: { age: 18 } }; $.extend(true, taytuj, rete); console.log(taytuj); // 執(zhí)行過程: //1.兩個(gè)對象都在內(nèi)存棧中,其中rete對象里面的 msg: { age: 18 }對象放在了內(nèi)存堆中,在淺拷貝中,rete對象里面的 msg: { age: 18 }會(huì)覆蓋掉taytu對象的msg: {sex: '男' },屬性值會(huì)變成一個(gè)16進(jìn)制指向內(nèi)存堆中的msg: { age: 18 }對象,此時(shí)??臻g中兩個(gè)對象的 msg里面都有同一個(gè)執(zhí)向內(nèi)存堆中msg: { age: 18 }的16進(jìn)制地址,所以如果淺拷貝完成后,兩個(gè)對象里面msg屬性值只要一個(gè)發(fā)生了改變,另外一個(gè)msg的屬性值也會(huì)隨著一起改變 //淺拷貝: //1.屬性名相同的,被拷貝對象會(huì)覆蓋掉拷貝對象,排序永遠(yuǎn)是后來居上 //2. 屬性名不相同的則合并 //深拷貝: //1.屬性名相同的,被拷貝對象的屬性和屬性值會(huì)覆蓋掉拷貝對象的屬性和屬性值,排序永遠(yuǎn)是后來居上 //2. 屬性名不相同的則合并 //3.拷貝對象和拷貝對象里面有對象的,如果對象名相同,屬性名不同,則會(huì)合并,并不是覆蓋。 }) </script> </head> <body> </body> </html>
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
Jquery實(shí)現(xiàn)上下移動(dòng)和排序代碼
這篇文章主要介紹了Jquery實(shí)現(xiàn)上下移動(dòng)和排序,想要學(xué)習(xí)Jquery的同學(xué)可以來了解一下。具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2016-10-10ztree簡介_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
zTree 是利用 JQuery 的核心代碼,實(shí)現(xiàn)一套能完成大部分常用功能的 Tree 插件,本文給大家簡單介紹下ztree的基本知識(shí),感興趣的朋友一起看看吧2017-07-07JQuery點(diǎn)擊事件回到頁面頂部效果的實(shí)現(xiàn)代碼
下面小編就為大家?guī)硪黄狫Query點(diǎn)擊事件回到頁面頂部效果的實(shí)現(xiàn)代碼。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05jquery實(shí)現(xiàn)隱藏在左側(cè)的彈性彈出菜單效果
這篇文章主要介紹了jquery實(shí)現(xiàn)隱藏在左側(cè)的彈性彈出菜單效果,涉及jQuery動(dòng)態(tài)操作頁面元素的顯示及隱藏技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09jQuery插件FusionCharts實(shí)現(xiàn)的Marimekko圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionCharts實(shí)現(xiàn)的Marimekko圖效果,結(jié)合實(shí)例形式分析了jQuery使用FusionCharts插件結(jié)合xml數(shù)據(jù)繪制Marimekko圖的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03JQUERY實(shí)現(xiàn)左側(cè)TIPS滑進(jìn)滑出效果示例
左側(cè)提示滑進(jìn)滑出的平滑效果使用jQuery實(shí)現(xiàn),具體代碼及截圖如下,感興趣的朋友可以參考下哈,希望對大家學(xué)習(xí)jquery有所幫助2013-06-06jQuery實(shí)現(xiàn)復(fù)選框批量選擇與反選的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)復(fù)選框批量選擇與反選的方法,主要通過jQuery的attr與removeAttr方法實(shí)現(xiàn)選擇與反選的功能,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-06-06