嗨各位大大~
我是Robin
經由緩慢學習Node也有一個多月的時間了，ヽ(́◕◞౪◟◕‵)ﾉ
在公司和以前學習階段不斷聽到CommonJs這個詞，
但是我始終沒有去研究他到底是什麼。
也許是我以前對於JS這語言很感冒
好！這都不是理由和藉口~
真相只有一個！
我就~~ 帥
如果你也不知道，
可以參考看看我觀察的感想(ﾉ>ω<)ﾉ
不懂的也可以在下方跟我討論唷~

此篇學習目標 ◑ω◐ ：

1. 什麼是CommonJS?
2. 在Node中實際使用起來會長什麼樣子？

什麼是CommonJS?

先來看看維基百科怎麼說

CommonJS是一個專案，其目標是為JavaScript在網頁瀏覽器之外建立模組約定。建立這個專案的主要原因是當時缺乏普遍可接受形式的JavaScript指令碼模組單元，模組在與執行JavaScript指令碼的常規網頁瀏覽器所提供的不同的環境下可以重複使用。

簡單來說CommonJS就是一個模組規範

首先，拋棄你那些高階的想法。
想像一下以前JS古人的時代，
每個人在寫JS時沒有分File，
直接在html的script tag 裡面寫JS那個景象嗎？
用想的是不是感覺就非常精彩！？
我是說Debug的部分xDD

此時此刻出現了模組化的概念

而模組化這個思想要實作，各個大神都有自己的一套實作方法
而沒有一個統一的規範與標準
再來也因為Javascript 想要進攻後端版圖，

所以也衍生出來ServerJS，
之後，ServerJS 更名為 CommonJS。
而CommonJS不是一個涵式庫。
再次強調！(ﾒ ﾟ皿ﾟ)ﾒ
上面有提到他是一個模組規範與標準 (兇屁
而也因為CommonJS在Node之中廣泛地被使用因此聲名大噪。
其實除了CommonJS還有其他的組織提供其他規範啦~
例如AMD,UMD,CMD...等等 ，這些就不贅述。

其實CommonJS對於模組的定義也是非常的簡單大致分為三個部分

1. 模組引用
2. 模組定義
3. 模組標示

(上述名詞可能會因為翻譯而略有不同)

講到這你可能也快睡著了ԅ(¯﹃¯ԅ)
來實際看看在Node之中怎麼實作

在Node中實際使用起來會長什麼樣子？

模組定義

白話就是寫一個程式把他包裝成一個 module，方便reuse。
保持DRY(Don't repeat your self)

// action.js
function turnRight() {
    return "右轉"
}

function turnLeft() {
    return "左轉"
}

module.exports = {
    turnRight,
    turnLeft
}

模組引用

白話來說就是用上述定義好的模組

// main.js
const action = require('action')

console.log(`紅燈要~${action.turnRight()}`)
console.log(`紅燈要~${action.turnLeft()}`)

執行結果

模組標示

白話說就是Coding Style的概念
主要就是在說require()內的參數

1. 必須是小駝峰的字串
2. 必須是以. , ..開頭的絕對路徑或相對路徑
3. 可以不必加上.js的後綴字

結語

其實CommonJS沒有想像中的那麼難懂，(●´ω｀●)ゞ
雖然之後出現了AMD,UMD甚至是相對較新的ES6等等模組規範，
但是對我來說，這些都不是重點...
重點是...
我現在時常用Node卻不知道我平常用的正是CommonJS規範好的。
覺得有一點丟臉(((ﾟДﾟ;)))

為什麼叫一統江山的CommonJS？
其實不知道欸感覺大家都在用，一個感覺～
雖然新的ES6看起來很香，
但是支援度還是稍嫌不足還是得靠Babel去轉，
講那麼多我還是會用新的啦(X
但是知道這個CommonJS感覺也不是一件壞事，
人嘛總是要溫故知新(根本不是這樣用)

補充一下
CommonJS是同步加載的
AMD是異步的，
有興趣的可以自行研究或是等我哪天有空再分享給你各位

好了~這篇就到這了

感謝各位
期待與您再次相會。

參考文獻

什麼？！我們竟然有 3 個標準？ - 你有聽過 CommonJS 嗎？(Day9)
CommonJS规范
試著把切版專案升級到 gulp4.0 吧 Day06 來自 gulp 的 hello world：JavaScript 模組化方案
Day29-JS模組化！(套件結合篇)