Module加載的詳細說明-保證你有所收獲( 二 )

// lib.jsexport let counter = 3;export function incCounter() {counter++;}// main.jsimport { counter, incCounter } from './lib';console.log(counter); // 3incCounter();console.log(counter); // 4在舉一個小粒子// m1.jsexport var foo = 'bar';setTimeout(() => foo = 'baz', 500);// m2.jsimport {foo} from './m1.js';console.log(foo);setTimeout(() => console.log(foo), 500);上面代碼中 , m1.js的變量,foo,在剛加載時等于bar,過了 500 毫秒,又變為等于baz 。Node.js 的模塊加載方法JavaScript 現在有兩種模塊 。一種是 ES6 模塊,簡稱 ESM;另一種是 CommonJS 模塊,簡稱 CJS 。CommonJS 模塊是 Node.js 專用的 , 與 ES6 模塊不兼容 。語法上面,兩者最明顯的差異是,CommonJS 模塊使用require()和module.exports.ES6 模塊使用import和export 。ps:從 Node.js v13.2 版本開始,Node.js 已經默認打開了 ES6 模塊支持 。Node.js 要求 ES6 模塊采用.mjs后綴文件名 。也就是說,只要腳本文件里面使用import或者export命令 , 那么就必須采用.mjs后綴名 。Node.js 遇到.mjs文件,就認為它是 ES6 模塊,默認啟用嚴格模式,不必在每個模塊文件頂部指定"use strict" 。友情提示注意,ES6 模塊與 CommonJS 模塊盡量不要混用 。require命令不能加載.mjs文件 , 會報錯 。只有import命令才可以加載.mjs文件 。反過來.mjs文件里面也不能使用require命令,必須使用import 。簡單說一下他們的第2個差異第二個差異是因為 CommonJS 加載的是一個對象,通過 module.exports 輸出 。該對象只有在腳本運行完才會生成 。而ES6 模塊不是對象,它的對外接口只是一種【靜態定義】,在代碼靜態解析階段就會生成 。【Module加載的詳細說明-保證你有所收獲】

推薦閱讀