模塊化
為了解決文件之間的依賴(lài),模塊化是一種約定好的規(guī)范。
模塊化規(guī)范是一種明文的約定,開(kāi)發(fā)者都按照規(guī)范來(lái)寫(xiě)代碼,減少溝通成本,極大的方便了各模塊之間的相互調(diào)用。
一、 了解 CommonJS 規(guī)范
作用:是一套 Javascript 的模塊化規(guī)范,規(guī)定了 模塊的特性 和 各模塊之間如何相互依賴(lài);
用途:Node.js 中使用了 CommonJS 規(guī)范;
特點(diǎn):同步加載模塊,不適合在瀏覽器端使用;瀏覽器端使用 AMD / CMD。
CommonJS規(guī)范都定義了哪些內(nèi)容:wiki 對(duì)于 Modules 的描述
4.1 如何引入: In a module, there is a free variable "require", that is a Function.
4.2 如何暴露給別人使用:In a module, there is a free variable called "exports", that is an object that the module may add its API to as it executes.
4.3 必須有一個(gè)變量module :In a module, there must be a free variable "module", that is an Object.
二、 瀏覽器端的 AMD 和 CMD 模塊化規(guī)范
注意:瀏覽器端不能使用 CommonJS規(guī)范;因?yàn)?CommonJS 下,模塊是同步加載的;
AMD/CMD可以理解為是commonjs在瀏覽器端的解決方案,AMD/CMD下,模塊都是異步加載的;
1. AMD模塊化規(guī)范代表:RequireJS
- 主要特性1:對(duì)于依賴(lài)的模塊,AMD 是提前執(zhí)行;
- 主要特性2:推崇依賴(lài)前置;
2. CMD模塊化規(guī)范代表:SeaJS
- 主要特性1:對(duì)于依賴(lài)的模塊,CMD 是延遲執(zhí)行;CMD 推崇 as lazy as possible.
- 主要特性2:推崇依賴(lài)就近;
3. ES6的模塊化(大趨勢(shì)):es6是在語(yǔ)言標(biāo)準(zhǔn)層面上,實(shí)現(xiàn)了模塊功能,而且實(shí)現(xiàn)得相當(dāng)簡(jiǎn)單,完全可以取代 CommonJS 和 AMD 規(guī)范,成為瀏覽器和服務(wù)器通用的模塊解決方案;
三、 模塊作用域 和 全局作用域
在Node.js中有兩個(gè)作用域,分別是 全局作用域 和 模塊作用域;
- 全局作用域: 使用 global 來(lái)訪問(wèn),類(lèi)似于瀏覽器中的 window;
- 每個(gè) Javascript 文件,都是一個(gè)單獨(dú)模塊,每個(gè)模塊都有自己獨(dú)立的作用域,因此:模塊中的成員,默認(rèn)無(wú)法被其它模塊訪問(wèn)。
- 默認(rèn)在 Node 中,每一個(gè) JS 文件中定義的 方法、變量,都是屬于 模塊作用域的.
掛載到global(不推薦,變量名污染)
var b = 20;
global.b = b;
global.say = function () {
console.log('這是掛載到全局的 say 方法');
}
四、 模塊作用域
1. module(模塊標(biāo)識(shí))
module 屬性是 Common JS 規(guī)范中定義的,它是一個(gè)對(duì)象,表示當(dāng)前這個(gè)具體的 js 模塊;
2. require(引用模塊)
每一個(gè)實(shí)現(xiàn)了 CommonJS 規(guī)范的模塊,必須定義一個(gè) require() 函數(shù),使用這個(gè) require 函數(shù),就能夠 很方便的導(dǎo)入其它 模塊中的成員,供自己使用;
3. exports(暴露模塊成員)
每一個(gè)模塊中,如果想要把自己的一些私有成員,暴露給別人使用,那么,必須實(shí)現(xiàn)一個(gè) exports 對(duì)象,通過(guò)exports對(duì)象,可以方便的把模塊內(nèi)私有的成員,暴露給外界使用;
五、module.exports 和 exports 的關(guān)系
- module.exports 和 exports 默認(rèn)引用了同一個(gè)空對(duì)象;
- module.exports 和 exports 作用一致,都可以向外暴露成員;
- 一個(gè)模塊作用域中,向外暴露私有成員時(shí),永遠(yuǎn)以 module.exports 為準(zhǔn);