阮一峰Js學(xué)習(xí)筆記(六 思想管怠、Js文件加載)

1、Js設(shè)計(jì)思路:
(1)借鑒C語(yǔ)言的基本語(yǔ)法亏掀;
(2)借鑒Java語(yǔ)言的數(shù)據(jù)類(lèi)型和內(nèi)存管理忱反;
(3)借鑒Scheme語(yǔ)言,將函數(shù)提升到"第一等公民"(first class)的地位滤愕;
(4)借鑒Self語(yǔ)言温算,使用基于原型(prototype)的繼承機(jī)制。

他是函數(shù)式編程和面向?qū)ο笫骄幊痰幕旌袭a(chǎn)物

'它的優(yōu)秀之處并非原創(chuàng)间影,它的原創(chuàng)之處并不優(yōu)秀注竿。'

2、文件加載:LABjs和RequireJS
可以用<script>標(biāo)簽加載js:
弊端:嚴(yán)格的順序讀然瓯帷巩割;可能會(huì)導(dǎo)致性能問(wèn)題(瀏覽器采用"同步模式"加載<script>標(biāo)簽,也就是說(shuō)随橘,頁(yè)面會(huì)"堵塞"(blocking)喂分,等待javascript文件加載完成,然后再運(yùn)行后面的HTML代碼机蔗。當(dāng)存在多個(gè)<script>標(biāo)簽時(shí),瀏覽器無(wú)法同時(shí)讀取甘萧,必須讀取完一個(gè)再去讀取另一個(gè)萝嘁,造成讀取時(shí)間大大延長(zhǎng),頁(yè)面響應(yīng)緩慢扬卷。)
解決這一問(wèn)題的方案:
2.1牙言、DOM

function loadScript(url){
// 瀏覽器即時(shí)創(chuàng)造出script標(biāo)簽,異步讀取怪得,不會(huì)導(dǎo)致頁(yè)面堵塞
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = url;
    document.body.appendChild(script);

  }

但是咱枉,這樣加載的Javascript文件,不在原始的DOM結(jié)構(gòu)之中蚕断,因此在DOM-ready(DOMContentLoaded)事件和window.onload事件中指定的回調(diào)函數(shù)對(duì)它無(wú)效。
2.2入挣、LabJS
待優(yōu)化的js:

<script src="script1.js"></script>
<script src="script2-a.js"></script>
<script src="script2-b.js"></script>
<script type="text/javascript">
  initScript1();
  initScript2();
</script>
<script src="script3.js"></script>
<script type="text/javascript">
  initScript3();
</script>

改寫(xiě):可以運(yùn)行多條$LAB鏈,且他們之間是獨(dú)立的,鏈內(nèi)部存在次序關(guān)系

<script src="LAB.js"></script>
  <script type="text/javascript">
    $LAB
     .script("script1.js").wait()
     .script("script2-a.js")
     .script("script2-b.js")
     .wait(function(){
       initScript1();
       initScript2();
     })
     .script("script3.js")
     .wait(function(){
       initScript3();
     });
  </script>

2.3障陶、RequireJS

<script src="require.js"></script>
  <script type="text/javascript">
    require([
      "script1.js",
      "script2-a.js",
      "script2-b.js",
      "script3.js"
     ],
     function(){
      initScript1();
      initScript2();
      initScript3();
     }
    );
  </script>

require()接受兩個(gè)參數(shù),第一個(gè)數(shù)組表示所要加載的Javascript文件聊训,第二個(gè)是加載完成后所要運(yùn)行的回調(diào)函數(shù)抱究。原生的require()不支持按次序加載,所以四個(gè)Javascript文件到底先加載哪個(gè)带斑,無(wú)法事前知道,require()只保證這四個(gè)文件全部加載完成之后遏暴,才會(huì)運(yùn)行所指定的回調(diào)函數(shù)。
RequireJS文檔:https://requirejs.org/

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末朋凉,一起剝皮案震驚了整個(gè)濱河市州丹,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌杂彭,老刑警劉巖墓毒,帶你破解...
    沈念sama閱讀 217,734評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異所计,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)团秽,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)习勤,“玉大人,你說(shuō)我怎么就攤上這事图毕。” “怎么了予颤?”我有些...
    開(kāi)封第一講書(shū)人閱讀 164,133評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)蛤虐。 經(jīng)常有香客問(wèn)我党饮,道長(zhǎng)笆焰,這世上最難降的妖魔是什么劫谅? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,532評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮荞驴,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘贯城。我一直安慰自己,他們只是感情好能犯,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,585評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著踩晶,像睡著了一般。 火紅的嫁衣襯著肌膚如雪渡蜻。 梳的紋絲不亂的頭發(fā)上术吝,一...
    開(kāi)封第一講書(shū)人閱讀 51,462評(píng)論 1 302
  • 那天茸苇,我揣著相機(jī)與錄音,去河邊找鬼学密。 笑死,一個(gè)胖子當(dāng)著我的面吹牛腻暮,可吹牛的內(nèi)容都是我干的彤守。 我是一名探鬼主播西壮,決...
    沈念sama閱讀 40,262評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼款青!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起抡草,我...
    開(kāi)封第一講書(shū)人閱讀 39,153評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎康震,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體宾濒,經(jīng)...
    沈念sama閱讀 45,587評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,792評(píng)論 3 336
  • 正文 我和宋清朗相戀三年橘忱,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了赴魁。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片钝诚。...
    茶點(diǎn)故事閱讀 39,919評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡颖御,死狀恐怖凝颇,靈堂內(nèi)的尸體忽然破棺而出潘拱,到底是詐尸還是另有隱情拧略,我是刑警寧澤芦岂,帶...
    沈念sama閱讀 35,635評(píng)論 5 345
  • 正文 年R本政府宣布垫蛆,位于F島的核電站禽最,受9級(jí)特大地震影響月褥,放射性物質(zhì)發(fā)生泄漏弛随。R本人自食惡果不足惜宁赤,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,237評(píng)論 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望决左。 院中可真熱鬧愕够,春花似錦佛猛、人聲如沸惑芭。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,855評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)婴渡。三九已至幻锁,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間哄尔,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,983評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工岭接, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留富拗,地道東北人鸣戴。 一個(gè)月前我還...
    沈念sama閱讀 48,048評(píng)論 3 370
  • 正文 我出身青樓啃沪,卻偏偏與公主長(zhǎng)得像葵擎,于是被迫代替她去往敵國(guó)和親谅阿。 傳聞我的和親對(duì)象是個(gè)殘疾皇子酬滤,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,864評(píng)論 2 354