問題:
javascript
查詢jquery源碼:
そうですね
看代碼:
輸出結果:html
在jQuery對象中,每一個對象都有一個prevObject屬性。java
問題1:這個屬性何時建立??----->>> 只要你建立了jQuery對象就會產生
問題2:在哪裏建立??------>>>> 在一個pushStack()方法裏產生
問題3:做用??? ----->>>>指向操做前的jQuery對象引用
問題4:如何建立?? ------>>>> 看源碼:
步驟:jquery
1. 建立一個jQuery對象,this.constructor()返回引用this 2. jQuery.merge 把elems節點,合併到新的jQuery對象 3. 給返回的新jQuery對象添加屬性prevObject
如今是否是還有點不懂??不要緊,繼續看圖.....
緩存
先查找$('.warp')的子元素,而後調用prevObject屬性,對比一看,他們倆都是class=warp的最外層div,證實prevObject確實是指向前一個操做,若是不進行任何破壞源對象的狀況下(就是不進行查詢過濾操做),該對象的prevObject對象就指向一個jQuery本身定義的空間,並且任何對象的prevObject都指向它,如圖:
總結:
備註:其實這個圖略微有些瑕疵,$('.warp').children()其實指向的是一個$('.warp')的一個副本dom
$('.warp').children().prevObject != $('.warp') $('.warp').children().prevObject !== $('.warp')
優勢:
1.很適合鏈式操做,好比我須要在一個父元素內尋找幾個毫無規律的子元素設置屬性或者搞其餘事情,在javascript中,你須要:函數
$('.father').find('.son1').prop().... $('.father').find('.son5').prop().... ....
你看這代碼,不停的建立這個父元素對象(固然你能夠緩存這個父對象),並且必須寫多行,倆者之間沒有任何關聯。而jquery利用了他們的共有規律(都是調用父元素去查找子元素進行操做,那我何不直接使用某個方法返回上一級操做的對象??)直接使用一個prevobject屬性去返回它,這樣就有了:性能
$('.father').find('.son1').prop().....巴拉巴拉操做 .prevObject.find('.son5').prop()...
直接一行完成操做像一條鏈子,不只好看,還一目瞭然....
2.咱們不多使用pushStack方法,然而在jQuery中,好多增刪改查操做都會使用這個方法,這使得該方法的封裝性和穩定性能都很very good!!ui
注意:addBack()方法返回的是當前操做對象和上一個操做對象,並且這個組合的新的對象會緩存在pushStack棧中this
當咱們寫腳本的時候,對代碼的封裝都要很好的完成,把一些最基本的但又是涉及到不少函數操做時的方法封裝在一個函數中,而後只提供一個接口給外面,相似於java的接口(高度抽象的方法),外面只能經過這個接口的一些屬性或者方法去調用,你能夠寫在原型上,採用原型模式,或者組合使用構造函數模式和原型模式,若是不適合你也能夠採用穩妥構造函數模式.
借鑑:
1.http://www.cnblogs.com/aaronj...
2.http://blog.csdn.net/wulex/ar...
3.https://stackoverflow.com/que...
4.https://www.learningjquery.co...
5.https://www.cnblogs.com/MnCu8...
6.http://jquery.cuishifeng.cn/i...
7.http://www.runoob.com/jquery/...