重新?lián)炱饋?lái)代碼
看一些原來(lái)用過(guò)的知識(shí)筐付,有一種豁然開(kāi)朗的感覺(jué)
類似于啊片,考上大學(xué)以后再回頭看高中的知識(shí)? ?
原來(lái)對(duì)js模塊化的認(rèn)識(shí)比較淺涛浙,僅僅是能理解的程度说庭,AMD/CMD很多面試中都問(wèn)過(guò)我
在阿里媽媽實(shí)習(xí)的時(shí)候然磷,導(dǎo)師跟我說(shuō)過(guò),騰訊面試的時(shí)候也問(wèn)過(guò)刊驴,那個(gè)時(shí)候就真的只是知道AMD CMD一個(gè)提前加載一個(gè)按需加載
工作以后姿搜,有個(gè)領(lǐng)導(dǎo)說(shuō)過(guò),架構(gòu)不是學(xué)來(lái)的捆憎,是一步步演進(jìn)的
前端技術(shù)也是舅柜,知道它們?nèi)绾我徊讲窖葸M(jìn)的,更有利于理解和合理運(yùn)用躲惰。
廢話不多說(shuō)致份,以后要堅(jiān)持寫(xiě)博客,堅(jiān)持學(xué)習(xí)础拨!
演進(jìn)過(guò)程:
一:js代碼都寫(xiě)在html文件中
二:js代碼寫(xiě)在js文件中氮块,在html中<script>引用
三:js文件變得原來(lái)越多,互相之間關(guān)系越來(lái)越復(fù)雜诡宗,比如jQuery必須在使用了jQuery的js文件之前引用滔蝉,否則會(huì)報(bào)錯(cuò),而且變量會(huì)污染全局作用域
四:js模塊化僚焦,commonjs就是js模塊化的規(guī)范锰提,通過(guò) require 方法來(lái)同步加載所要依賴的其他模塊,然后通過(guò) exports 或者 module.exports 來(lái)導(dǎo)出需要暴露的接口。根據(jù)這個(gè)規(guī)范立肘,每一個(gè)文件就是一個(gè)模塊边坤,其內(nèi)部定義的變量是屬于這個(gè)模塊的,不會(huì)對(duì)外暴露谅年,也就是說(shuō)不會(huì)污染全局變量茧痒。?
五:AMD規(guī)范,AMD標(biāo)準(zhǔn)中融蹂,模塊可以異步加載旺订,并且允許指定回調(diào)函數(shù)。但是超燃,在使用require.js的時(shí)候区拳,我們必須要提前加載所有的依賴,然后才可以使用意乓,而不是需要使用時(shí)再加載樱调。
定義了下面兩個(gè)API:
require([module], callback)
define(id, [depends], callback)
即通過(guò)define來(lái)定義一個(gè)模塊,然后使用require來(lái)加載一個(gè)模塊届良。 并且笆凌,require還支持CommonJS的模塊導(dǎo)出方式。?
六:CMD按需加載士葫,sea.js乞而,需要寫(xiě)加載邏輯,在用到模塊的時(shí)候慢显,再require
七:ES6模塊化,export和import導(dǎo)出和引用模塊爪模,一個(gè)js文件是一個(gè)模塊