【我可以你也可以的Node.js】第八篇 - 一统江山的CommonJS

嗨各位大大~
我是Robin
经由缓慢学习Node也有一个多月的时间了，ヽ(́◕◞౪◟◕‵)ﾉ
在公司和以前学习阶段不断听到CommonJs这个词，
但是我始终没有去研究他到底是什么。
也许是我以前对于JS这语言很感冒
好！这都不是理由和藉口~
真相只有一个！
我就~~ 帅
如果你也不知道，
可以参考看看我观察的感想(ﾉ>ω<)ﾉ
不懂的也可以在下方跟我讨论唷~

此篇学习目标 ◑ω◐ ：

什么是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对于模组的定义也是非常的简单大致分为三个部分

(上述名词可能会因为翻译而略有不同)

讲到这你可能也快睡着了ԅ(¯﹃¯ԅ)
来实际看看在Node之中怎么实作

在Node中实际使用起来会长什么样子？

模组定义

白话就是写一个程式把他包装成一个 module，方便reuse。
保持DRY(Don't repeat your self)

// action.jsfunction turnRight() {    return "右转"}function turnLeft() {    return "左转"}module.exports = {    turnRight,    turnLeft}

模组引用

白话来说就是用上述定义好的模组

// main.jsconst action = require('action')console.log(`红灯要~${action.turnRight()}`)console.log(`红灯要~${action.turnLeft()}`)

执行结果

模组标示

白话说就是Coding Style的概念
主要就是在说require()内的参数

结语

其实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模组化！(套件结合篇)