jQuery源碼研究——怎麼看源碼

廢話

這幾天有想看源碼的想法,因而就開始了源碼的研究,通過幾天的摸索發現看源碼仍是有點技巧在裏面的,想着把這些東東寫下來做爲一個小總結。html

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

無論是什麼源碼其研究方式基本上都是大同小異的,標題寫jQuery是由於這幾天正好在研究jQuery源碼,這裏就拿jQuery做爲講解的對象。瀏覽器

基本步驟

研究源碼的第一步找到源碼的入口,找源碼的入口能夠經過打斷點的方式找到,好比像下面這樣架構

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

而後咱們打開Chrome瀏覽器給console.log($())這行打個斷點,以下圖工具

3

經過以上方法咱們找到了入口,剩下的就是跟着調試器看看這些代碼怎麼執行的。學習

對於某個特定的方法咱們也能夠經過打斷點的方式來看這些代碼大概是在作什麼,好比jQuery中的extend方法調試

4

打斷點不單單是用來調試的,還能夠看成學習的工具。經過打斷點的方式可使咱們對程序的執行過程以及依賴關係有個粗略的瞭解。code

但無論是方法仍是技巧它都只能解決咱們的一部分問題,要真正的看懂和理解源碼還存在不少其餘因素。htm

閒扯

看源碼這件事吧,不要抱着一次就能看懂的心態去學,其實想一想咱們看源碼不就是爲了學習嘛,不必定說要所有都看懂,只要比以前進步一點也很不錯啊,這樣壓力會小點吧,有時壓力太大就不想學了。對象

源碼能夠從不一樣的角度去看,從架構,從細節、又或是某些工具方法,若是技術不太好咱們能夠先從工具類方法看起,對一些複雜的方法能夠先忽略一些細節先搞清楚它是幹什麼的,這未嘗不是一種方法。

相關文章
相關標籤/搜索