一年前,剛來網(wǎng)易實(shí)習(xí)的時(shí)候接觸了NEJ,那是第一次接觸模塊化開發(fā),感覺想出這個(gè)idea的人簡直是天才,同時(shí)也對于這種框架的實(shí)現(xiàn)非常好奇,慚愧的是,那時(shí)甚至連jQuery的原理都不知道。
隨著這一年對于JS面向?qū)ο蟮睦斫庥兴由?,看著《JavaScript設(shè)計(jì)模式》就跟著自己動(dòng)手碼碼代碼,所以這是一篇讀書筆記,并不是發(fā)明創(chuàng)造,并且這個(gè)加載器是比較簡陋的,很有改進(jìn)空間。
模塊的長相
模塊采用的是匿名模塊,它的js絕對路徑作為它的惟一標(biāo)識(shí):
define([ '{lib}dom', '{pro}extend' ], function(dom, extend) { //TODO})
異步加載的思路
從上面我們可以看出,模塊是由define函數(shù)來定義,傳入?yún)?shù)為:依賴列表和回調(diào)函數(shù),為了實(shí)現(xiàn)依賴注入,要等到依賴列表的所有js加載完后再來執(zhí)行回調(diào)函數(shù)。
所以第一步,我們循環(huán)遍歷依賴列表,然后依次加載列表的模塊,可想而知,在循環(huán)遍歷加載模塊的代碼的結(jié)構(gòu)應(yīng)該是下面這樣子的:
//modules = ['lib/dom