Jquery的深度拷贝和深度克隆
有人問(wèn),拷貝和克隆不都是“復(fù)制”的意思嗎。
這位看官問(wèn)的好,一般情況下是一樣的,但在jquery中卻有些不同。jqurey深度拷貝一般只js對(duì)象的復(fù)制,是$.extend()方法,jquery深度克隆一般指dom對(duì)象的復(fù)制,是$.clone()方法。
$.extend()
語(yǔ)法:jQuery.extend( [deep ], target, object1 [, objectN ] )
用途:復(fù)制js對(duì)象,或?qū)蓚€(gè)或更多對(duì)象的內(nèi)容合并到第一個(gè)對(duì)象。
深淺拷貝對(duì)應(yīng)的參數(shù)就是[deep],是可選的,為true或false。默認(rèn)情況是false(淺拷貝),并且false是不能夠顯示的寫出來(lái)的。如果想寫,只能寫true(深拷貝),在默認(rèn)情況下,通過(guò)$.extend()合并操作不是遞歸的(淺拷貝);如果第一個(gè)對(duì)象的屬性本身是一個(gè)對(duì)象或數(shù)組,那么它將完全用第二個(gè)對(duì)象相同的key重寫一個(gè)屬性。這些值不會(huì)被合并。然而,如果將?true?作為該函數(shù)的第一個(gè)參數(shù),那么會(huì)在對(duì)象上進(jìn)行遞歸的合并(深拷貝)。
淺拷貝(false 默認(rèn)):如果第二個(gè)參數(shù)對(duì)象有的屬性第一個(gè)參數(shù)對(duì)象也有,那么不會(huì)進(jìn)行相同參數(shù)內(nèi)部的比較,直接將第一個(gè)對(duì)象的相同參數(shù)覆蓋。
深拷貝(true):如果第二個(gè)參數(shù)對(duì)象有的屬性第一個(gè)參數(shù)對(duì)象也有,還要繼續(xù)在這個(gè)相同的參數(shù)向下一層找,比較相同參數(shù)的對(duì)象中是否還有不一樣的屬性,如果有,將其繼承到第一個(gè)對(duì)象,如果沒(méi)有,則覆蓋。
1 var object1 = { 2 apple: 0, 3 banana: { 4 weight: 52, 5 price: 100 6 }, 7 cherry: 97 8 }; 9 var object2 = { 10 banana: { 11 price: 200 12 }, 13 durian: 100 14 }; 15 //默認(rèn)情況淺拷貝 16 //object1--->{"apple":0,"banana":{"price":200},"cherry":97,"durian":100} 17 //object2的banner覆蓋了object1的banner,但是weight屬性未被繼承 18 //$.extend(object1, object2); 19 //深拷貝 20 //object1--->{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100} 21 //object2的banner覆蓋了object1的banner,但是weight屬性也被繼承了呦 22 $.extend(true,object1, object2); 23 console.log('object1--->'+JSON.stringify(object1));$.clone()
語(yǔ)法:$(selector).clone(includeEvents)
用途:用于處理dom的克隆
.clone()方法深度 復(fù)制所有匹配的元素集合,包括所有匹配元素、匹配元素的下級(jí)元素、文字節(jié)點(diǎn)。clone方法比較簡(jiǎn)單就是克隆節(jié)點(diǎn),但是需要注意,如果節(jié)點(diǎn)有事件或者數(shù)據(jù)之類的其他處理,我們需要通過(guò)clone(ture)傳遞一個(gè)布爾值ture用來(lái)指定,這樣不僅僅只是克隆單純的節(jié)點(diǎn)結(jié)構(gòu),還要把附帶的事件與數(shù)據(jù)給一并克隆了
1 $("div").on('click', function() {//執(zhí)行操作}) 2 //clone處理一 3 $("div").clone() //只克隆了結(jié)構(gòu),事件丟失 4 //clone處理二 5 $("div").clone(true) //結(jié)構(gòu)、事件與數(shù)據(jù)都克隆轉(zhuǎn)載于:https://www.cnblogs.com/guanghe/p/9999210.html
總結(jié)
以上是生活随笔為你收集整理的Jquery的深度拷贝和深度克隆的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: KMP经典算法与变形的应用(字符串par
- 下一篇: CSDN代码块显示颜色