成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

jQuery 源碼分析

whlong / 905人閱讀

摘要：這里在函數(shù)中有一個(gè)的操作，一般構(gòu)造函數(shù)不會這樣寫，但這樣寫并不會影響的結(jié)果，這參照之前的分解，便可以推出結(jié)果的一致只是返回了不同但值相同的變量。

這篇文章可以說是讀這篇文章這篇文章后的總結(jié)。

jQuery最基本的構(gòu)成結(jié)構(gòu)：

var jQuery = window.jQuery = window.$ = function(a,b){
  return new jQuery.fn.init(a, b);  // 1
}；

jQuery.fn = jQuery.prototype = {
  init: function (s) {
    this[0] = s;
    this.length = 1;
    this.context = s;
    return this;  // 2
  },
  age: function () {
    return this;
  }
};

jQuery.fn.init.prototype = jQuery.fn;  // 3

jQuery.extend = jQuery.fn.extend = function () {
  // 4
}

這是jQuery源碼一個(gè)最基本的概要實(shí)現(xiàn)，但從這個(gè)實(shí)現(xiàn)中已經(jīng)能弄并學(xué)到很多東西了。

( 1 ) 首先 $ 也就是 jQuery 本身是一個(gè)函數(shù)， 但它又不是一個(gè)普通的構(gòu)造函數(shù)，這從 $("div") 的這種實(shí)例直接產(chǎn)生不需要 new 就可以知道，也就是它隱藏了實(shí)例 new 的過程， jQuery 自身只是一個(gè)工廠函數(shù)，它產(chǎn)出由它的原型上定義的 init 方法的實(shí)例，因?yàn)閾碛辛?new 的過程，所以實(shí)例化中的 this 都是指向了 最終產(chǎn)生的實(shí)例本身，于是這樣便實(shí)現(xiàn)了無new構(gòu)建。

( 2 ) 這里在 init 函數(shù)中有一個(gè) return this; 的操作，一般構(gòu)造函數(shù)不會這樣寫，但這樣寫并不會影響 new 的結(jié)果，這參照之前new 的分解，便可以推出結(jié)果的一致（ 只是返回了不同但值相同的變量 ）。而jQuery之所以在這里要返回 this 是有用處的，這樣最開始實(shí)例的 this 便得以保存，$("div").ready() 這樣的鏈?zhǔn)秸{(diào)用便能得到前方的實(shí)例對象，也就是說就是 return this; 實(shí)現(xiàn)了鏈?zhǔn)秸{(diào)用。

( 3 ) 那既然是原型上的 init 構(gòu)造器方法構(gòu)建的實(shí)例，又怎么能獲取到 jQuery 的原型方法呢，這就需要將 init 方法的原型用 jQuery 的原型對象覆蓋。也就是 3 部分的操作。

( 4 ) 最后 $.extend 與 $.fn.extend 之所以會不一樣，只是調(diào)用時(shí)分別是jQuery對象或jQuery.prototype(jQuery.prototype = jQuery.fn)導(dǎo)致了 this 的不同，實(shí)際定義是是用的同一個(gè)函數(shù)。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/90217.html

相關(guān)文章

  • jQuery源碼分析之noConflict()

    摘要：將或者的控制權(quán)讓給第一個(gè)實(shí)現(xiàn)它的那個(gè)庫，確保不會與其它庫的對象發(fā)生沖突。 noConflict() noConflict()將$或者jQuery的控制權(quán)讓給第一個(gè)實(shí)現(xiàn)它的那個(gè)庫，確保jQuery不會與其它庫的$對象發(fā)生沖突。 jQuery中源碼如下： var _jQuery = window.jQuery, _$ = window.$; jQuery.noConflict =...

    Yuanf 評論0 收藏0

  • 體驗(yàn)javascript之美-第十一課-jquery源碼分析

    摘要：可以直接在這里查看至于的開源就不多說了。官網(wǎng)一個(gè)庫的官網(wǎng)永遠(yuǎn)是了解它最新進(jìn)展和學(xué)習(xí)資料的首選網(wǎng)站。比如下面我們就拿舉例分析下它的源碼。不解釋，你可以直接拿過去改吧改吧用在你自己的庫里。 上節(jié)課我們說了寫一個(gè)庫的準(zhǔn)備，但是這節(jié)課并不是寫庫為什么，有句話叫你沒吃過豬肉還沒看過豬走。所以我們先看看別人的庫是怎么寫的。在我們擁有了足夠扎實(shí)的基礎(chǔ)之后我們要做的不是閉門造車，而是去閱讀一些知名的庫...

    王晗 評論0 收藏0

  • jQuery源碼分析3-jQuery對象的擴(kuò)展--extend

    摘要：的指向的是對象，所以此時(shí)擴(kuò)展的是對象，可以直接通過的方式調(diào)用。 寫過jquery插件的人都知道可以通過jquery提供的extend可以對jquery對象進(jìn)行擴(kuò)展，而且該方法不僅可以對jquery對象擴(kuò)展，還能給一個(gè)對象添加新的屬性和方法，這個(gè)在后面會介紹。 通過不同的方式調(diào)用extend擴(kuò)展的方法也不同： 通過 $.extend() 擴(kuò)展的是靜態(tài)方法； 而通過 $.fn.exten...

    MonoLog 評論0 收藏0

  • jquery源碼分析

    摘要：前言隨著前端的不斷發(fā)展，很多開發(fā)人員已經(jīng)開始使用等框架，但是很少有人去深入分析以及的源碼本人也是，至今還停留在使用的層面。最近還在寫一些的筆記，有興趣的小白也可以看下我的博客文章源碼分析地址 前言 隨著前端的不斷發(fā)展，很多開發(fā)人員已經(jīng)開始使用react、vue等web框架，但是很少有人去深入分析vue以及react的源碼（本人也是，至今還停留在使用的層面）?？蚣艿氖褂脛荼貢懈碌?..

    SHERlocked93 評論0 收藏0

  • jQuery源碼分析-整體架構(gòu)（轉(zhuǎn)）

    摘要：文章出處拜讀一個(gè)開源框架，最想學(xué)到的就是設(shè)計(jì)的思想和實(shí)現(xiàn)的技巧。利用下的簡單工廠模式，來將所有對于同一個(gè)對象的操作指定同一個(gè)實(shí)例。所以的中提供了以上中擴(kuò)展函數(shù)。 文章出處 http://www.cnblogs.com/aaronjs/p/3278578.html 拜讀一個(gè)開源框架，最想學(xué)到的就是設(shè)計(jì)的思想和實(shí)現(xiàn)的技巧。 廢話不多說，jquery這么多年了分析都寫爛了，老早以前就拜讀過，...

    voidking 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<