搜尋
首頁web前端js教程淺析AMD CMD CommonJS規格--javascript模組化載入學習心得總結_javascript技巧

這是一篇關於javascript模組化AMD,CMD,CommonJS的學習總結,作為記錄也給同樣對三種方式有疑問的童鞋們,有不對或者偏差之處,望各位大神指出,不勝感激。

本篇預設讀者大概知道require,seajs的用法(AMD,CMD用法),所以沒有加入使用語法。

1、為何而生:

 這三個規格都是為javascript模組化加載而生的,都是在用到或預計要用到某些模組時候加載該模組,使得大量的系統巨大的龐雜的程式碼得以很好的組織和管理。模組化使得我們在使用和管理程式碼的時候不那麼混亂,也方便了多人的合作。


2、那些規範們:

(1)、CommonJS 是一個有志於建構 JavaScript 生態圈的組織。整個社群致力於提高 JavaScript 程式的可攜性和可交換性,無論是在服務端還是瀏覽器端。

a group with a goal of building up the JavaScript ecosystem for web servers, desktop and command line apps and in the browser.

一個有目標的建置JavaScript生態系統Web伺服器群組,在瀏覽器和命令列應用程式和桌面。 (他自己wiki上這麼說的)

這個組織呢制定了一些規範 (可以去他們網站看看 http://www.commonjs.org/)包括CommonJS Modules/1.0 規範,我們平常所說的commonjs規範,說的就是這個了。

 「The CommonJS API will fill that gap by defining APIs that handle many common application needs, ultimately providing a standard library as rich as those of Python, Ruby and Java. 」--(http://www.com)-- org/)

所以說Commonjs是一個比較偏向伺服器端的規格。 Node.js採用了這個規範。 根據CommonJS規範,一個單獨的檔案就是一個模組。載入模組使用require方法,方法讀取 取一個檔案並執行,最後傳回檔案內部的exports物件。

他又說了,可以用在下面這些場景  ,所以他更明顯的偏向伺服器端。當然你也可以把它用在瀏覽器裡邊(他們自己說可以)。

•Server-side JavaScript applications
•Command line tools
•Desktop GUI-based applications
•Hybrid applications (Titanium, Adob​​​​e AIR)

(2)、AMD規範

Commonjs解決了模組化的問題,並且可以用在瀏覽器中,但是Commonjs是同步載入模組,當要用到該模組了,現載入現用,這種同步機製到了瀏覽器裡邊就有問題了,載入速度啊啥的(覽器同步載入模組會導致效能、可用性、偵錯和跨網域存取等問題)。

鑑於瀏覽器的特殊情況,又出現了一個規範,這個規範呢可以實現異步加載依賴模組,並且會提前加載那就是AMD規範。 AMD可以作為CommonJS模組一個中轉的版本只要CommonJS沒有被用來同步的require呼叫。使用同步require呼叫的CommonJS程式碼可以轉換為使用回呼風格的AMD模組載入器(https://github.com/amdjs/amdjs-api/wiki/AMD-(%E4%B8%AD%E6%96% 87%E7%89%88)  (它所說的)。

下面是一個使用了簡單CommonJS轉換的模組定義(它是amd規範的一種用法):

複製程式碼 程式碼如下:
   define(function (require, exports, module) {
     var a = require('a'),
         b = require('b');
     exports.action = function () {};

   });


所以說AMD和Commonjs是相容的,只要稍稍調換一下調用方法就實現了同步加載(我很懷疑amd也是在commonjs基礎上加了個殼,然後並沒有找到其他的神馬說明和支持的文字,找到了一定加到這裡)。

看一下AMD規格你會發現,AMD基本上都是提前說明依賴模組,然後預先載入這些模組,其實這就要求你事先想好這些依賴,事先寫好,不然寫程式碼過程要回到開頭繼續加入依賴。

 
(3)、CMD

不知道是不是針對這個問題,淘寶的玉伯大牛搞了個seajs出來,並聲稱這個規範是遵循CMD規範的,然後給出了這個規範的一個連接(打開會發現draft字樣)。關於這個規範呢玉伯在知乎是這麼說的

”AMD 是 RequireJS 在推廣過程中對模組定義的規範化產出。

CMD 是 SeaJS 在推廣過程中對模組定義的規範化產出。
類似的還有 CommonJS Modules/2.0 規範,是 BravoJS 在推廣過程中對模組定義的規範化產出。
還有不少⋯⋯

所以這個規範其實是為了Seajs的推廣然後搞出來的。那麼看看SeaJS是怎麼回事吧,基本上就是知道這個規範了。

同樣Seajs也是預先載入依賴js跟AMD的規範在預先載入這一點上是相同的,明顯不同的地方是調用,和聲明依賴的地方。 AMD和CMD都是用difine和require,但是CMD標準傾向於在使用過程中提出依賴,就是不管代碼寫到哪突然發現需要依賴另一個模組,那就在當前代碼用require引入就可以了,規範會幫你搞定預先加載,你隨便寫就可以了。但AMD標準讓你必須提前在頭部依賴參數部分寫好(沒有寫好?倒回去寫好咯)。這就是最明顯的差別。


3.共生共處

由於CommonJS是伺服器端的規範,更另外兩個標準實際上不衝突。

AMD在國外用的更多,當然國內也是不少的,jQuery1,7版本開始使用,Dojo在1.6版本開始用,這已經能夠證明它足夠牛x了。

CMD當然也有很多人在用,但是基本上都集中在國內,Seajs官網就展示了一大堆牛逼的公司在用(包括愛奇藝,騰訊微博,支付寶,淘寶等一大堆,去這裡看看http://seajs.org/docs/),估計小的不出名的也不計其數了,畢竟很多公司招聘都要求會seajs嘛。

所以三個規範目前都挺好(其實也主要是因為js麼有自己的模組載入機制,es6出來之後不知道會怎樣)。

當我們寫一個檔案需要與不同的載入規範相容的時候怎麼辦呢,看看下面的程式碼。

(function (root, factory) { 
 
  if (typeof define === 'function' && define.amd) { 
 
    // AMD 
 
    define(['jquery', 'underscore'], factory); 
 
  } else if (typeof exports === 'object') { 
 
    // Node, CommonJS之类的 
 
    module.exports = factory(require('jquery'), require('underscore')); 
 
  } else { 
 
    // 浏览器全局变量(root 即 window) 
 
    root.returnExports = factory(root.jQuery, root._); 
 
  } 
 
}(this, function ($, _) { 
 
  // 方法 
 
  function a(){}; // 私有方法,因为它没被返回 (见下面) 
 
  function b(){}; // 公共方法,因为被返回了 
 
  function c(){}; // 公共方法,因为被返回了 
 
    
 
  // 暴露公共方法 
 
  return { 
 
    b: b, 
 
    c: c 
 
  } 
 
}));

這個程式碼可以相容於各種載入規範了。


4、AMD和CMD的差別

下面這幾點是玉伯在知乎上說的。

1. 對於依賴的模組,AMD 是提前執行,CMD 是延遲執行。不過 RequireJS 從 2.0 開始,也改成可以延遲執行(依寫法不同,處理方式不同)。 CMD 推崇 as lazy as possible.
2. CMD 推崇依賴就近,AMD 推崇依賴前置。

3. AMD 的 API 預設是一個當多個用,CMD 的 API 嚴格區分,推崇職責單一。例如 AMD 裡,require 分割全域 require 和局部 require,都叫 require。 CMD 裡,沒有全域 require,而是根據模組系統的完備性,提供 seajs.use 來實現模組系統的載入啟動。 CMD 裡,每個 API 都簡單純粹。
 
4. 還有一些細節差異,具體看這個規範的定義就好,就不多說了。
     ( 好吧~第四點是不多說了。。。。。。。)


5.AMD和CMD的一些相同

都有difine和require,而且呼叫方式實際上都可以加入依賴參數,也就是說都可以用提供依賴參數的方式來實現預先載入依賴模組(但不建議因為  注意:帶id 和deps 參數的define用法不屬於CMD 規範,而屬於Modules/Transport 規範。 ---來自:https://github.com/seajs/seajs/issues/242)。

AMD也可以在factory中使用require來現加載用到的模組,但是這個模組就不會預先加載,屬於用到才加載的同步加載了。

var a = require('a'); // 載入模組a

有不妥之處,歡迎斧正。

以上這篇淺析AMD CMD CommonJS規格--javascript模組化載入學習心得總結就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
修复:Windows 11 中未安装 AMD 显卡驱动程序错误修复:Windows 11 中未安装 AMD 显卡驱动程序错误May 03, 2023 am 09:13 AM

在配备AMDGPU的Windows11PC上出现未安装AMD显卡驱动程序错误。这是某些用户在选择AMDRadeon设置上下文菜单选项时发生的错误。弹出此错误消息,而不是打开AMDRadeon设置:未安装AMD显卡驱动程序,或AMD驱动程序无法正常运行。请安装适合您的AMD硬件的AMD驱动程序。该错误消息突出显示了AMD图形驱动程序的问题。这通常意味着PC具有过时、不兼容或损坏的AMD驱动程序。这是您可以修复Windows11中未安装AMD

amd radeon software是什么amd radeon software是什么Feb 21, 2023 am 11:58 AM

amd radeon software是显卡的驱动程序,是用于Advanced Micro Devices的显卡和APU的设备驱动程序和实用程序软件包。Radeon Software驱动不只是包含显卡驱动程序,实际上还包含设置及问题报告向导、HDMI音频驱动等,如果不想对显卡做各种设置。除了识别显卡信息,Radeon Software还能识别显示器并提供丰富的显示器设置功能。

AMD RX 7800M XT在3DMark测试中获得高分,可与桌面端RTX 4070媲美AMD RX 7800M XT在3DMark测试中获得高分,可与桌面端RTX 4070媲美Jun 07, 2023 pm 11:45 PM

6月7日消息,根据最新报道,AMD公司的移动显卡AMDRadeonRX7800MXT首次公布了其在3DMark跑分测试中的成绩,显示该显卡性能将超越上一代的RX6800。据可靠消息源透露,还有其他基于Navi32核心的AMD移动显卡规格被曝光,这也是用于AMDRadeonRX7700/7800系列的Navi32芯片首次亮相。从跑分结果来看,在TimeSpy测试中,AMDRX7800MXT获得了17842的分数,与桌面端的RTX4070显卡的表现相当(IT之家注:RTX4070分数为17736,而

怎样从 Windows 11 下载 AMD 显卡驱动程序怎样从 Windows 11 下载 AMD 显卡驱动程序May 09, 2023 pm 09:52 PM

使用图形处理单元(GPU)或显卡在Windows11计算机上显示图形。因此,今天我们将了解如何在Windows11上下载AMD显卡驱动程序。内置的任务管理器软件是确定您的计算机正在使用哪个显卡以及当前使用了多少电量的最简单、最准确的方法。跟随我们将首先看看如果您从PC中删除AMD软件会发生什么,然后跳转到您可以在Windows11设备上下载图形驱动程序的方法列表。如果我删除AMD软件会怎样?AMDRadeon设置是主要的驱动程序界面,允许用户更改图形驱动程序的许多

由于 fTPM 错误,AMD PC 在 Windows 10 和 11 上出现卡顿,临时解决方法由于 fTPM 错误,AMD PC 在 Windows 10 和 11 上出现卡顿,临时解决方法May 13, 2023 pm 07:04 PM

一两个月以来,AMD的Ryzen处理器被发现在启用固件TPM(fTPM)的Windows10和11系统上卡顿(通过Reddit)或冻结。今天,AMD在确定导致这些问题的原因后发布了一份公告。据该公司称,挂起和卡顿是由串行外设接口(SPI)闪存ROM内的扩展内存事务操作引起的。AMD已确定,选定的AMDRyzen™系统配置可能会间歇性地在位于主板上的SPI闪存(“SPIROM”)中执行与fTPM相关的扩展内存事务,这可能导致系统交互性或响应性暂时暂

AMD发布Ryzen 7000系列新成员:Ryzen 5 7500F处理器AMD发布Ryzen 7000系列新成员:Ryzen 5 7500F处理器Jul 20, 2023 pm 12:01 PM

7月11日消息,据知情人士透露,AMD公司计划在中国市场推出一款全新处理器型号,名为AMDRyzen57500F。该处理器被认为是Ryzen7000系列中的一员,相较于Ryzen57600,7500F不包含集成的核显。这一消息显示,AMD将首先在中国发布Ryzen57500F处理器,并且暂无计划将其引入美国市场。AMDRyzen57500F处理器采用了Ryzen7000系列的制造工艺,而非像Ryzen57600一样采用了APU芯片。据了解,该处理器将于本月底面向中国市场的零售商和电商平台发布,并

突破性的AMD原型处理器亮相:锐龙9 5900X3D震撼亮相突破性的AMD原型处理器亮相:锐龙9 5900X3D震撼亮相Jun 20, 2023 pm 03:55 PM

6月20日消息,近期,AMD在其奥斯汀总部向少数媒体展示了一款令人惊叹的原型产品,名为“锐龙95900X3D”。这款处理器采用了最新的3DV-Cache缓存技术,为AMD的锐龙产品线带来了显著的性能提升。据了解,这款“锐龙95900X3D”处理器集成了12个Zen4核心和128MB的3D缓存。在Windows任务管理器中,该处理器显示出192MB的三级缓存(128MB3D缓存+64MB原生缓存),以及6MB的二级缓存和768KB的一级缓存,总共达到了198.75M

2022 年 12 月星期二补丁日触发 AMD 锐龙 PC 上的冻结问题2022 年 12 月星期二补丁日触发 AMD 锐龙 PC 上的冻结问题Apr 13, 2023 pm 07:28 PM

以防万一您还不知道,11 月的周二补丁日更新修复了与大多数 AMD 处理器上的 Spectre 变体 2 相关的安全漏洞。话虽如此,12 月的下一次跟进,即 2022 年的最后一次跟进,显然在配备 AMD CPU 的系统上并不是最好的。为什么?好吧,因为一些用户报告了其AMD Ryzen系统上的冻结问题。这似乎发生在带有KB11更新的Windows 11 22H2上5021255。Windows 11 版本 22H2 上出现问题老实说,这不是微软第一次或最后一次使用旨在实际改进它的补丁来破坏系统

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

倉庫:如何復興隊友
1 個月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
1 個月前By尊渡假赌尊渡假赌尊渡假赌

熱工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),

SecLists

SecLists

SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。