CommonJS 與ES六、AMD等標準

簡介：

1、ES6與nodeJS 

require/exports 出生在野生規範當中，什麼叫作野生規範？即這些規範是 JavaScript 社區中的開發者本身草擬的規則，獲得了你們的認可或者普遍的應用。好比 CommonJS、AMD、CMD 等等。import/export 則是名門正派。TC39 制定的新的 ECMAScript 版本，即 ES6（ES2015）中包含進來。

區別：

import 、export 是es6的一個語法標準，若是要兼容瀏覽器的話必須轉化成es5的語法。

require、exports是CommonJS的標準。是Nodejs所使用的標準，目前NodeJs還沒法支持ES6. 因此目前react、vue等框架使用的大多數模塊都仍是使用的CommonJS標準。看到的多數是require寫法，能夠理解爲使用require的寫法使用範圍更普遍，由於它是創建在es5標準之上的

CommonJS 做爲 Node.js 的規範，一直沿用至今。因爲 npm 上 CommonJS 的類庫衆多，以及 CommonJS 和 ES6 之間的差別，Node.js 沒法直接兼容 ES6。

因此現階段 require/exports 任然是必要且實必須的。出自 ES6 的 import/export 相對就晚了許多。被你們所熟知和使用也是 2015 年以後的事了。
這其實要感謝 babel（原來項目名叫作 6to5，後改名爲 babel） 這個神通常的項目。因爲有了 babel 將還未被宿主環境（各瀏覽器、Node.js）直接支持的 ES6 Module 編譯爲 ES5 的 CommonJS —— 也就是 require/exports 這種寫法 —— Webpack 插上 babel-loader 這個翅膀纔開始高飛，你們也才能夠稱 " 我在使用 ES6！ "

 

2、AMD規範和CommonJS規範的區別：（參考：http://www.javashuo.com/article/p-fowgdsnn-k.html）

有了服務器端模塊之後，很天然地，你們就想要客戶端模塊。並且最好二者可以兼容，一個模塊不用修改，在服務器和瀏覽器均可以運行。

可是，因爲一個重大的侷限，使得CommonJS規範不適用於瀏覽器環境。仍是上一節的代碼，若是在瀏覽器中運行，會有一個很大的問題

1 2	var  math = require('math'); math.add(2, 3);

第二行math.add(2, 3)，在第一行require(‘math’)以後運行，所以必須等math.js加載完成。也就是說，若是加載時間很長，整個應用就會停在那裏等。

這對服務器端不是一個問題，由於全部的模塊都存放在本地硬盤，能夠同步加載完成，等待時間就是硬盤的讀取時間。可是，對於瀏覽器，這倒是一個大問題，由於模塊都放在服務器端，等待時間取決於網速的快慢，可能要等很長時間，瀏覽器處於」假死」狀態。
所以，瀏覽器端的模塊，不能採用」同步加載」（synchronous），只能採用」異步加載」（asynchronous）。這就是AMD規範誕生的背景。

AMD是」Asynchronous Module Definition」的縮寫，意思就是」異步模塊定義」。它採用異步方式加載模塊，模塊的加載不影響它後面語句的運行。全部依賴這個模塊的語句，都定義在一個回調函數中，等到加載完成以後，這個回調函數纔會運行。