前端AMD規(guī)范

molyzzx 發(fā)布于2019-08-19 18:45 / 448人閱讀

摘要：如果是對(duì)象，此對(duì)象應(yīng)該為模塊的輸出值在頁(yè)面上使用函數(shù)加載模塊函數(shù)接受兩個(gè)參數(shù)第一個(gè)參數(shù)是一個(gè)數(shù)組，表示所依賴的模塊第二個(gè)參數(shù)是一個(gè)回調(diào)函數(shù)，當(dāng)前面指定的模塊都加載成功后，它將被調(diào)用。

個(gè)人總結(jié)：AMD規(guī)范主要是解決各個(gè)模塊之間的依賴關(guān)系，可以順序的加載js模塊，但是卻是異步加載，不會(huì)影響頁(yè)面的css和html標(biāo)簽的加載。

AMD 即Asynchronous Module Definition，中文名是異步模塊定義的意思。它是一個(gè)在瀏覽器端模塊化開(kāi)發(fā)的規(guī)范
由于不是JavaScript原生支持，使用AMD規(guī)范進(jìn)行頁(yè)面開(kāi)發(fā)需要用到對(duì)應(yīng)的庫(kù)函數(shù)，也就是大名鼎鼎RequireJS，實(shí)際上AMD 是 RequireJS 在推廣過(guò)程中對(duì)模塊定義的規(guī)范化的產(chǎn)出
requireJS主要解決兩個(gè)問(wèn)題
多個(gè)js文件可能有依賴關(guān)系，被依賴的文件需要早于依賴它的文件加載到瀏覽器
js加載的時(shí)候?yàn)g覽器會(huì)停止頁(yè)面渲染，加載文件越多，頁(yè)面失去響應(yīng)時(shí)間越長(zhǎng)
看一個(gè)使用requireJS的例子
// 定義模塊 myModule.js

define(["dependency"], function(){
    var name = "Byron";
    function printName(){
        console.log(name);
    }

    return {
        printName: printName
    };
});

// 加載模塊
require(["myModule"], function (my){
　 my.printName();
});

語(yǔ)法
requireJS定義了一個(gè)函數(shù) define，它是全局變量，用來(lái)定義模塊

define(id?, dependencies?, factory);
id：可選參數(shù)，用來(lái)定義模塊的標(biāo)識(shí)，如果沒(méi)有提供該參數(shù)，腳本文件名（去掉拓展名）
dependencies：是一個(gè)當(dāng)前模塊依賴的模塊名稱數(shù)組
factory：工廠方法，模塊初始化要執(zhí)行的函數(shù)或?qū)ο?。如果為函?shù)，它應(yīng)該只被執(zhí)行一次。如果是對(duì)象，此對(duì)象應(yīng)該為模塊的輸出值
在頁(yè)面上使用require函數(shù)加載模塊

require([dependencies], function(){});
require()函數(shù)接受兩個(gè)參數(shù)

第一個(gè)參數(shù)是一個(gè)數(shù)組，表示所依賴的模塊
第二個(gè)參數(shù)是一個(gè)回調(diào)函數(shù)，當(dāng)前面指定的模塊都加載成功后，它將被調(diào)用。加載的模塊會(huì)以參數(shù)形式傳入該函數(shù)，從而在回調(diào)函數(shù)內(nèi)部就可以使用這些模塊
require()函數(shù)在加載依賴的函數(shù)的時(shí)候是異步加載的，這樣瀏覽器不會(huì)失去響應(yīng)，它指定的回調(diào)函數(shù)，只有前面的模塊都加載成功后，才會(huì)運(yùn)行，解決了依賴性的問(wèn)題。

推薦文章：http://www.cnblogs.com/dolphinX/p/4381855.html

GPU云服務(wù)器云服務(wù)器前端規(guī)范前端規(guī)范文檔 AMD AMD EYPC

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/79950.html

相關(guān)文章

前端模塊化開(kāi)發(fā)

摘要：來(lái)源于阿賢博客模塊化今天給大家寫一篇關(guān)于前端模塊化開(kāi)發(fā)知識(shí)點(diǎn)。前端模塊化開(kāi)發(fā)那點(diǎn)歷史模塊化是指在解決某個(gè)復(fù)雜混雜問(wèn)題時(shí)，依照一種分類的思維把問(wèn)題進(jìn)行系統(tǒng)性的分解以之處理。來(lái)源于：阿賢博客 javascript模塊化今天給大家寫一篇關(guān)于前端模塊化開(kāi)發(fā)知識(shí)點(diǎn)。前端模塊化開(kāi)發(fā)那點(diǎn)歷史模塊化：是指在解決某個(gè)復(fù)雜、混雜問(wèn)題時(shí)，依照一種分類的思維把問(wèn)題進(jìn)行系統(tǒng)性的分解以之處理。模塊...

tianhang 2019-08-23 16:44 評(píng)論0 收藏0
從 1 到完美，寫一個(gè) js 庫(kù)、node 庫(kù)、前端組件庫(kù)

摘要：從到完美，寫一個(gè)庫(kù)庫(kù)前端組件庫(kù)之前講了很多關(guān)于項(xiàng)目工程化前端架構(gòu)前端構(gòu)建等方面的技術(shù)，這次說(shuō)說(shuō)怎么寫一個(gè)完美的第三方庫(kù)。使用導(dǎo)出模塊，就可以在使用這個(gè)庫(kù)的項(xiàng)目中構(gòu)建時(shí)使用功能。從 1 到完美，寫一個(gè) js 庫(kù)、node 庫(kù)、前端組件庫(kù) 之前講了很多關(guān)于項(xiàng)目工程化、前端架構(gòu)、前端構(gòu)建等方面的技術(shù)，這次說(shuō)說(shuō)怎么寫一個(gè)完美的第三方庫(kù)。 1. 選擇合適的規(guī)范來(lái)寫代碼 js 模塊化的發(fā)展大致有...

rollback 2019-08-29 17:18 評(píng)論0 收藏0
從 1 到完美，寫一個(gè) js 庫(kù)、node 庫(kù)、前端組件庫(kù)

摘要：從到完美，寫一個(gè)庫(kù)庫(kù)前端組件庫(kù)之前講了很多關(guān)于項(xiàng)目工程化前端架構(gòu)前端構(gòu)建等方面的技術(shù)，這次說(shuō)說(shuō)怎么寫一個(gè)完美的第三方庫(kù)。使用導(dǎo)出模塊，就可以在使用這個(gè)庫(kù)的項(xiàng)目中構(gòu)建時(shí)使用功能。從 1 到完美，寫一個(gè) js 庫(kù)、node 庫(kù)、前端組件庫(kù) 之前講了很多關(guān)于項(xiàng)目工程化、前端架構(gòu)、前端構(gòu)建等方面的技術(shù)，這次說(shuō)說(shuō)怎么寫一個(gè)完美的第三方庫(kù)。 1. 選擇合適的規(guī)范來(lái)寫代碼 js 模塊化的發(fā)展大致有...

xiaolinbang 2019-08-26 13:22 評(píng)論0 收藏0
前端模塊化進(jìn)程，commonJS，AMD，CMD對(duì)比

摘要：是另一種模塊化方案，它與很類似，不同點(diǎn)在于推崇依賴前置提前執(zhí)行，推崇依賴就近延遲執(zhí)行。 commonJS規(guī)范隨著前端技術(shù)的不斷發(fā)展，項(xiàng)目越來(lái)越大，越來(lái)越不好管理，多人開(kāi)發(fā)越來(lái)讓開(kāi)發(fā)者頭疼，于是出現(xiàn)了命名空間，這沒(méi)有辦法的辦法，但是所有變量都是全局的話，管理非?；靵y，而且在Node 出現(xiàn)前，javascript 在服務(wù)器端基本沒(méi)有市場(chǎng)，經(jīng)過(guò)javascript 不斷努力，社區(qū)為 jav...

firim 2019-08-20 19:01 評(píng)論0 收藏0
【JS基礎(chǔ)】一文看懂前端模塊化規(guī)范

摘要：參考資料前端模塊化詳解完整版入門近一萬(wàn)字的語(yǔ)法知識(shí)點(diǎn)補(bǔ)充徹底搞清楚中的和和詳解前言前端的模塊化之路經(jīng)歷了漫長(zhǎng)的過(guò)程，想詳細(xì)了解的小伙伴可以看浪里行舟大神寫的前端模塊化詳解(完整版)，這里根據(jù)幾位大佬們寫的文章，將模塊化規(guī)范部分做了匯總和整理，希望讀完的小伙伴能有些收獲，也希望覺(jué)得有用的小伙伴可以點(diǎn)個(gè)贊，筆芯。什么是模塊將一個(gè)復(fù)雜的程序依據(jù)一定的規(guī)則(規(guī)范)封裝成幾個(gè)塊(文件)...

HelKyle 2019-08-23 17:09 評(píng)論0 收藏0
前端模塊化規(guī)范筆記

摘要：目前通行的的模板規(guī)范共有兩種和的模塊系統(tǒng)，是參照規(guī)范實(shí)現(xiàn)的即為服務(wù)器端模塊的規(guī)范。規(guī)范則是非同步加載模塊，允許指定回調(diào)函數(shù)。目前通行的Javascript的模板規(guī)范共有兩種：CommonJS 和 AMD commonjs nodejs的模塊系統(tǒng)，是參照commonjs規(guī)范實(shí)現(xiàn)的 commonjs即為服務(wù)器端模塊的規(guī)范。 commonjs的規(guī)范：根據(jù)commonjs規(guī)范，一個(gè)單獨(dú)的...

honmaple 2019-08-21 10:56 評(píng)論0 收藏0