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

資訊專欄INFORMATION COLUMN

Zepto.js源碼學(xué)習(xí)之一

hlcc / 1230人閱讀

摘要：元旦假期轉(zhuǎn)眼即過，終于在最后一天想起最初那個(gè)宏偉的計(jì)劃，然后默默撿起源碼的第一行。在具體深入之前，我希望能對庫結(jié)構(gòu)有一個(gè)整體的了解。最外層為一個(gè)匿名的立即執(zhí)行函數(shù)，因?yàn)橹恍枰獔?zhí)行一次。

元旦假期轉(zhuǎn)眼即過，終于在最后一天想起最初那個(gè)“宏偉”的計(jì)劃，然后默默撿起Zepto源碼的第一行。在具體深入之前，我希望能對Zepto庫結(jié)構(gòu)有一個(gè)整體的了解?？吹臅r(shí)間比較短，以下如果有不正確的地方，歡迎指出。

最外層 
(function(global, factory) {
  if (typeof define === "function" && define.amd)
    define(function() {
      return factory(global);
    })
  else
    factory(global)
}(this, function(window) {
   blablabla......                               區(qū)域1
}))

區(qū)域1為略去的細(xì)節(jié)，后面會介紹，此處只集中注意力于最外層。
最外層為一個(gè)匿名的立即執(zhí)行函數(shù)，因?yàn)橹恍枰獔?zhí)行一次。該函數(shù)接受兩個(gè)參數(shù)，第一個(gè)參數(shù)表示zepto將掛載的這個(gè)對象，第二個(gè)參數(shù)為一個(gè)函數(shù)，主要的內(nèi)容都由該函數(shù)完成（這里暫且稱之為‘主要函數(shù)’，即區(qū)域1），至于‘主要函數(shù)’具體做了哪些工作，下面介紹。

主要函數(shù)

‘主要函數(shù)’的縮略代碼如下

function (window) {
   var Zepto = (function() {
      blablablabla......                         區(qū)域2
   })();
   window.Zepto = Zepto;                         區(qū)域3
   window.$ === undefined && (window.$ = Zepto); 區(qū)域4
   (function($) {
      blablablabla......                         區(qū)域5
   })(Zepto);
   (function($) {
      blablablabla......                         區(qū)域6
   })(Zepto);
   (function($) {
      blablablabla......                         區(qū)域7
   })();
   return Zepto;                                 
}

該函數(shù)分為6個(gè)部分，分別對應(yīng)上面代碼段的區(qū)域2-7，主要完成Zepto對象的定義以及Zepto對象上相關(guān)方法的定義。
區(qū)域2為定義Zepto對象；區(qū)域3將Zepto對象綁定為window對象的Zepto屬性和$屬性，$即成為Zepto的一個(gè)別名，這在使用中會牽涉到別名的沖突及處理，此處不詳細(xì)展開；區(qū)域4完成事件相關(guān)方法的定義；區(qū)域5主要定義網(wǎng)絡(luò)請求的相關(guān)方法；區(qū)域6主要是封裝表單數(shù)據(jù)處理的相關(guān)方法；區(qū)域7對getComputedStyle的參數(shù)進(jìn)行兼容undefined處理。

下一次會更詳細(xì)的學(xué)習(xí)和分享，大概會按照上面的區(qū)域加以展開。

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

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

相關(guān)文章

  • Zepto這樣操作元素屬性

    摘要：還有一點(diǎn)需要注意的是方法設(shè)置或者獲取都是在操作元素的屬性，那它和，的區(qū)別在哪呢可以查看設(shè)置設(shè)置與的設(shè)置部分比較類似，既支持直接傳入普通的字符串也支持傳入回調(diào)函數(shù)。 前言 使用Zepto的時(shí)候，我們經(jīng)常會要去操作一些DOM的屬性，或元素本身的固有屬性或自定義屬性等。比如常見的有attr(),removeAttr(),prop(),removeProp(),data()等。接下來我們挨個(gè)整...

    付倫 評論0 收藏0

  • 一步步搭建物聯(lián)網(wǎng)系統(tǒng)——無處不在的三劍客

    摘要：無處不在的三劍客這時(shí)我們終于了解了我們的三劍客，他們也就這么可以結(jié)合到一起了，是這一切的基礎(chǔ)。無處不在的三劍客就這樣到了這里，寫得似乎很多也很少，但是還是沒有做出來一個(gè)東西，于是我們朝著這樣一個(gè)方向前進(jìn)。 無處不在的三劍客 這時(shí)我們終于了解了我們的三劍客，他們也就這么可以結(jié)合到一起了，HTML+Javascript+CSS是這一切的基礎(chǔ)。而我們用到的其他語言如PHP、Python、R...

    dreamans 評論0 收藏0

  • Zepto.js源碼學(xué)習(xí)之二

    摘要：本次主要分享關(guān)于上一篇區(qū)域的學(xué)習(xí)。區(qū)域?yàn)榈暮诵牟糠?，它的結(jié)構(gòu)如下為了便于梳理思路，以上代碼省略了細(xì)節(jié)，只保留了輪廓脈絡(luò)。最終暴露給開發(fā)者的如下圖所示這里只分析了區(qū)域的結(jié)構(gòu)，下一次會深入到函數(shù)語句粒度。 本次主要分享關(guān)于上一篇區(qū)域2的學(xué)習(xí)。區(qū)域2為Zepto的核心部分，它的結(jié)構(gòu)如下 var Zepto = (function() { var $, zepto = {}; fu...

    kel 評論0 收藏0

  • 向zepto.js學(xué)習(xí)如何手動(trigger)觸發(fā)DOM事件

    摘要：好啦我們已經(jīng)解決了是啥的疑問了，現(xiàn)在回去開始一步步解讀如何實(shí)現(xiàn)手動觸發(fā)事件。我們主要看看這里面幾乎含有如何手動觸發(fā)一個(gè)事件的大部分步驟和內(nèi)容。 前言 前端在最近幾年實(shí)在火爆異常，vue、react、angular各路框架層出不窮，咱們要是不知道個(gè)雙向數(shù)據(jù)綁定，不曉得啥是虛擬DOM，也許就被鄙視了?；馃岬谋澈笸彩菬o盡的浮躁，學(xué)習(xí)這些先進(jìn)流行的類庫或者框架可以讓我們走的更快，但是靜下心...

    spacewander 評論0 收藏0

發(fā)表評論

0條評論

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