首頁 >web前端 >js教程 >怎麼才能看懂jQuery源碼?

怎麼才能看懂jQuery源碼?

零下一度
零下一度原創
2017-06-26 11:41:192814瀏覽
廢話怎麼才能看懂jQuery源碼?>

這幾天有想看源碼的想法,於是就開始了源碼的研究,經過幾天的摸索發現看源碼還是有點技巧在裡面的,想著把這些東東寫下來作為一個小總結。

在一個多月前我對Vue源碼進行了一次研究,那時看源碼的方式基本上是從上往下看,結果看著看著就看不下去了,後來找了一個很老的版本看,但看的還是不太懂,於是想著乾脆看一些工具類得了,因為工具類一般比較單一不會和上下文有太多的聯繫,有點基本都能看懂。

不管是什麼源碼其研究方式基本上都是大同小異的,標題寫jQuery是因為這幾天正好在研究jQuery源碼,這裡就拿jQuery作為講解的對象。

基本步驟怎麼才能看懂jQuery源碼?>

研究原始碼的第一步找到原始碼的入口,找原始碼的入口可以透過打斷點的方式找到,例如像下面這樣

<script src="dist/jquery.js?1.1.11"></script><script>console.log($())</script>

然後我們打開Chrome瀏覽器給console.log($())這行打個斷點,如下圖

怎麼才能看懂jQuery源碼?

透過以上方法我們找到了入口,剩下的就是跟著調試器看看這些程式碼怎麼執行的。

對於某個特定的方法我們也可以透過打斷點的方式來看這些程式碼大概是在做什麼,例如jQuery中的extend方法

怎麼才能看懂jQuery源碼?

打斷點不只是用來調試的,還可以當作學習的工具。透過打斷點的方式可以使我們對程式的執行過程以及依賴關係有個粗略的了解。

但不管是方法還是技巧它都只能解決我們的一部分問題,要真正的看懂和理解源碼還存在很多其他因素。

閒扯怎麼才能看懂jQuery源碼?>

看源碼這件事吧,不要抱著一次就能看懂的心態去學,其實想想我們看源碼不就是為了學習嘛,不一定說要全部都看懂,只要比之前進步一點也很不錯啊,這樣壓力會小一點吧,有時壓力太大就不想學了。

原始碼可以從不同的角度去看,從架構,從細節、又或是某些工具方法,如果技術不太好我們可以先從工具類方法看起,對一些複雜的方法可以先忽略一些細節先搞清楚它是做什麼的,這何嘗不是一種方法。

以上是怎麼才能看懂jQuery源碼?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn