requirejs的加載原理 - 場景1. 定義一個require依賴b模塊


我們學習一個新的技術,熟練的使用之后,就應該去探索它的原理。這篇文章我們來探索下requirejs的原理。

從4個場景來探索requirejs的原理

場景1. 定義一個require依賴b模塊

場景2. 定義一個require依賴模塊b,模塊b依賴模塊c

場景3. 定義一個依賴來自外部的js模塊

場景4. 當出現循環依賴時

本篇博客講場景1

 步驟一,斷點代碼到define方法,我們傳入的name,deps和callback被push到golbalDefQueue數據中

 

 

 步驟二,斷點到requirejs方法,在這個方法內部調用了intakeDefines這個方法是對步驟1中golbalDefQueue數組內容轉換成module,並且調用module的init方法對模塊進行了初始化,這時候module的狀態為inited

 

 

 

 

步驟三:當所有的module都初始化后,進入了requirejs的settimeout函數。這里因為require(["b"], function(){})首先要生成一個自定義名字的模塊,它的依賴為b,然后執行這個自定義模塊的init並且設置這個module的狀態為enabled。

 

 步驟四,init方法內部會調用enable方法,這個方法是一個遞歸的方法,對它的依賴module遞歸執行enable方法。父模塊會綁定一個子模塊的defined事件,當子模塊觸發defined事件時,會將已經defined的模塊加入到父模塊的依賴數組中,當所有的依賴都defined后,執行父模塊的的callback方法(也就是定義在require中的function)

 

 

 

 好了,這里介紹了requirejs的加載過程,總結:

a. 首先執行define方法,將所有的定義的模塊都放到golbalDefQueue中

b. 執行requirejs方法,將所有的golbalDefQueue中的模塊取出,並轉換成module,這時候module的狀態為inited

c. 執行setimeout方法,根據require方法生產一個主module,然后eabled主module,並且依次enabled所有的依賴module。每次調用enable時,module的狀態為enabled

d. 當module的所有依賴都defined時,執行require的回調方法,將module的狀態更新為defined。

下篇文章繼續介紹下一個場景:當依賴模塊來自外部的js文件時,requirejs的執行過程。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM