這篇文章主要介紹了NodeJS模塊與ES6模塊系統(tǒng)語法及注意點有哪些，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)建站是專業(yè)的潛山網(wǎng)站建設(shè)公司，潛山接單;提供網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計,網(wǎng)頁設(shè)計,網(wǎng)站設(shè)計,建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進行潛山網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團隊,希望更多企業(yè)前來合作!

社區(qū)模塊規(guī)范:

1.CommonJS規(guī)范

規(guī)范實現(xiàn)者：

NodeJS 服務(wù)端

Browserify 瀏覽器

2.AMD規(guī)范 全稱 異步模塊定義

規(guī)范實現(xiàn)者：

RequireJS 瀏覽器

3.CMD規(guī)范 通用模塊定義

規(guī)范實現(xiàn)者：

seaJS 服務(wù)端和瀏覽器通用

官方模塊規(guī)范

1.ESM規(guī)范 就是ES6 Module

各瀏覽器和服務(wù)端

目前常用的就是瀏覽器端的RequireJS、NodeJS、以及ESM

CommonJS語法分析

module.export

關(guān)鍵

1.module.exports實質(zhì)上是一個對象,最后模塊導(dǎo)出的對象就是這個引用指向的對象

 module.export.key = value
 // eg: 
 module.export.a = 1; 
 // 整體管理導(dǎo)出，此時exports與module.exports指向斷開，導(dǎo)致exports上的屬性被忽略
 module.export = {
 a:1,
 b:1
 }

2.exports是一個module.export的助手變量，用于就地導(dǎo)出,兩者默認(rèn)指向同一對象，即module.exports === exports true

 // 像比較長的程序,寫完所有之后，再去找到需要導(dǎo)出的變量再移到低端的export.module上逐個添加，是相當(dāng)麻煩，一般在變量下決定是否導(dǎo)出
 //eg 
 let fA = function () {

 }
 module.exports.fA = fA
 let fB = function () {

 }
 module.exports.fB = fB

 // exports 簡潔很多
 let fA = function () {

 }
 module.fA = fA
 let fB = function () {

 }
 module.fB = fB

3.在逐個導(dǎo)出時使用exports,而在導(dǎo)出一個對象時，使用module.exports，不建議混用，如果需要，可以作一下處理:

 // 在最后導(dǎo)出時將exports對象和module.exports對象合并
 exports.a = 1
 module.exports = Object.assign({
 b : 1
 },exports)

require

關(guān)鍵:

1.模塊區(qū)分，知道即可

let f = require('url')

 // 核心模塊,第三方模塊(npm安裝),指定模塊名即可
 let f = require ('modulename')
 // 自定義模塊，需指定相對或者絕對路徑
 let f = require('absolutePATH/relativeAPTH')

2.查找時,沒有后綴名的會嘗試添加.js、.json、.node,這里可以稍微偷個懶

 let f = require('./circle')
 // 等同于
 let f = require('./circle.js')

ESM語法分析：

export var/function/class

關(guān)鍵:

1.導(dǎo)出值和內(nèi)部值要有對于關(guān)系,即

 // error
 export 1

 // error
 let m = 1
 export m

 // correct
 export let m = 1

 // correct
 let m = 1;
 export {m}

直接在聲明時導(dǎo)出或者用一個{}包裹導(dǎo)出

2.export default 用于導(dǎo)出一個默認(rèn)值，使得用戶可以不需要知道內(nèi)部導(dǎo)出變量名稱即可使用

PS: 一個模塊只能有一個默認(rèn)導(dǎo)出

 export default 等同 export {add as default}
 // 不能接變量聲明語句
 export default let a = 1

普通導(dǎo)出與默認(rèn)導(dǎo)出使用的區(qū)別

 // 普通導(dǎo)出的導(dǎo)入使用
 export {f}
 import {f} from 'fmod'

 // 默認(rèn)導(dǎo)出的導(dǎo)入使用,可以無需知道導(dǎo)出模塊的內(nèi)部變量名,任意重命名
 export default f
 import c from 'fmod'

3.導(dǎo)出值與模塊值是動態(tài)綁定的

export let foo = 'bar';
// 500毫秒后,其他模塊拿到的foo值會變成bar
setTimeout(() => foo = 'baz', 500);

import用法

關(guān)鍵:

1.導(dǎo)入非默認(rèn)變量時需要使用{}語法，并且變量要與導(dǎo)出時變量一致

 // 普通導(dǎo)出的導(dǎo)入使用
 export {f}
 import {f} from 'fmod'

2.導(dǎo)入默認(rèn)變量時，省略{},并且可以重命名導(dǎo)出變量

 // 默認(rèn)導(dǎo)出的導(dǎo)入使用,可以無需知道導(dǎo)出模塊的內(nèi)部變量名,任意重命名
 export default f
 import c from 'fmod'

3.可以使用*導(dǎo)出整體模塊

 // circle.js
 export let radius = 1
 export let area = 2*PI*radius
 // main.js
 import * as circle from './circle.js'
 circle.radius
 circle.area

4.可以使用,同時導(dǎo)出默認(rèn)導(dǎo)出和常規(guī)導(dǎo)出

import _,{each, forEach} from 'lodash'

5.多次import同一模塊，只會執(zhí)行一次

6.import可以與require混用，但是其在靜態(tài)分析階段執(zhí)行，也就是會先于require加載,這在要求一定的導(dǎo)入順序時要注意

export { foo, bar } from 'my_module';

// 可以簡單理解為,但是合并寫法等同于沒有在當(dāng)前模塊中導(dǎo)入my_module，即無法使用
import { foo, bar } from 'my_module';
export { foo, bar };

ESM加載CommmonJS

關(guān)鍵：

1.CommonJS模塊輸出對象module.exports將會被Node轉(zhuǎn)換成默認(rèn)導(dǎo)出

 // 導(dǎo)出
 export default module.exports
 // 導(dǎo)入,類似導(dǎo)入默認(rèn)
 import m from './m'

2.此時CommonJS模塊變量遵循其規(guī)則，不會動態(tài)綁定

 module.exports = 123;
 setTimeout(() => module.exports = null,500)
 //500毫秒后，module.exports仍然是123

3.由于CommonJS模塊運行時，才會確定輸出的module.exports對象，而ESM在編譯時就要確定接口，導(dǎo)入時，不允許解構(gòu)語法

 import {readFile} from 'fs'

解決方案：

 //整體導(dǎo)入 
 import * as express from 'express'
 const app = express.default()
 
 //默認(rèn)導(dǎo)入,更優(yōu)
 import express from 'express'
 const app = express()

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“NodeJS模塊與ES6模塊系統(tǒng)語法及注意點有哪些”這篇文章對大家有幫助，同時也希望大家多多支持創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計公司，關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計公司行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、網(wǎng)站設(shè)計器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

分享名稱：NodeJS模塊與ES6模塊系統(tǒng)語法及注意點有哪些-創(chuàng)新互聯(lián)
本文來源：http://weahome.cn/article/hhgpc.html