摘要:模塊的文件名,帶有絕對路徑。返回一個布爾值,表示模塊是否已經完成加載。返回一個對象,表示調用該模塊的模塊。表示模塊對外輸出的值。
我們在編寫js過程中,經常會碰到 requrie和import的寫法,也會看到export default,exports的寫法,他們能不能混用呢,我們來探究一下
當前環(huán)境:node版本 v9.6.1module
操作系統(tǒng) Mac
我們打印出module,結果如下
module.id 模塊的識別符,通常是帶有絕對路徑的模塊文件名。exports與module.exports
module.filename 模塊的文件名,帶有絕對路徑。
module.loaded 返回一個布爾值,表示模塊是否已經完成加載。
module.parent 返回一個對象,表示調用該模塊的模塊。
module.children 返回一個數(shù)組,表示該模塊要用到的其他模塊。
module.exports 表示模塊對外輸出的值。
我們可以看到在模塊中exports和module.exports 是同一個對象
就相當于,文件執(zhí)行前默認執(zhí)行了一下語句
let exports = module.exports;export
var firstName = "Michael"; var lastName = "Jackson"; var year = 1958; export {firstName, lastName, year};
執(zhí)行結果
我們看到在node v9.6.1 版本中并不支持export,我們使用bable轉譯后看一下
其實使用export,編譯后還是使用的exports
var firstName = "Michael"; var lastName = "Jackson"; export default firstName; export {lastName };關于node中模塊導出結論
所以node中導出模塊只會用到了module.exports,其他語法都只是一些包裝而已
require 當modle.js為exports的形式時module.js
var firstName = "Michael"; var lastName = "Jackson"; exports.default = firstName; exports.lastName = lastName;
index.js
const test4 = require("./modle"); console.log(test4);
結果
{ default: "Michael", lastName: "Jackson" }當modle.js為export的形式時
module.js
var firstName = "Michael"; var lastName = "Jackson"; export default firstName; export lastName = lastName;
index.js
const test4 = require("./modle"); console.log(test4);
結果:
{ default: "Michael", lastName: "Jackson" }結論
require接受到的是module.exports對象
當你使用export default firstName時,轉化成了exports.default = firstName;
所以無論你使用什么樣的形式導出模塊,對于require來說都是一樣的
var firstName = "Michael"; var lastName = "Jackson"; export default firstName; export { lastName };
index.js
import test6 from "./module"; console.log(test6);
結果
Michael
這里就和require不一樣了,import默認導出的是 export default
index.js
import * as test6 from "./module"; console.log(test6);
結果:
{ default: "Michael", lastName: "Jackson" }
這時候導出的結果才和require一致
當import test6 from "./module"是,默認會查找default,假如沒有export default那么 test6為undefined,那么要導出lastName就得使用
import { lastName } from "./module";當modle.js為exports的形式時
var lastName = "Jackson"; var firstName = "Michael"; exports = { lastName , firstName };
index.js
import test7 from "./module"; console.log(test7);
結果
{ firstName: "Michael", lastName: "Jackson" }結論
導出模塊可以使用 export和exports,引入模塊可以使用 import和require,但兩兩可以交叉使用,
import/export 最終都是編譯為 require/exports 來執(zhí)行的
只是export 會有一個default的不同,但一般來說export對應import,exports對應require。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉載請注明本文地址:http://m.hztianpu.com/yun/94137.html
摘要:要想讓模塊再次運行,必須清除緩存。用戶自己編寫的模塊,稱為文件模塊。并且和指向了同一個模塊對象。模塊路徑這是在定位文件模塊的具體文件時指定的查找策略,具體表現(xiàn)為一個路徑組成的數(shù)組。 前言 Node應用是由模塊組成的,Node遵循了CommonJS的模塊規(guī)范,來隔離每個模塊的作用域,使每個模塊在它自身的命名空間中執(zhí)行。 CommonJS規(guī)范的主要內容: 模塊必須通過 module.exp...
摘要:模塊化是隨著前端技術的發(fā)展,前端代碼爆炸式增長后,工程化所采取的必然措施。目前模塊化的思想分為和。特別指出,事件不等同于異步,回調也不等同于異步。將會討論安全的類型檢測惰性載入函數(shù)凍結對象定時器等話題。 Vue.js 前后端同構方案之準備篇——代碼優(yōu)化 目前 Vue.js 的火爆不亞于當初的 React,本人對寫代碼有潔癖,代碼也是藝術。此篇是準備篇,工欲善其事,必先利其器。我們先在代...
摘要:目前主流的模塊規(guī)范模塊通用模塊如果你在文件頭部看到這樣的代碼,那么這個文件使用的就是規(guī)范實際上就是全局變量這三種風格的結合這段代碼就是對當前運行環(huán)境的判斷,如果是環(huán)境就是使用規(guī)范,如果不是就判斷是否為環(huán)境,最后導出全局變量有了后我們的代碼和 目前主流的模塊規(guī)范 UMD CommonJs es6 module umd 模塊(通用模塊) (function (global, facto...
摘要:本文主要介紹幾種模塊導入導出的方法。默認導出如果只在一個文件中提供了一個導出的口,就可以使用默認導出在中可以看到輸入同樣是模塊導入導出方法,使用的模塊方法,要比中的也就是模塊方法更加的差異非常大。 在開發(fā)中基本不會將所有的業(yè)務邏輯代碼放在一個JS文件中,特別是在使用前端框架,進行組件化開發(fā)中時,會復用相應的組件。這時,就會用到模塊導入/導出的方法了。 當然,上面提到有模塊的概念,也是在...
摘要:所有依賴這個模塊的語句,都定義在一個回調函數(shù)中,等到加載完成之后,這個回調函數(shù)才會運行。目前,主要有兩個庫實現(xiàn)了規(guī)范和。這些導出對象用名稱進行區(qū)分,稱之為命名式導出。 簡單粗暴,富婆給你說,其實我也沒太搞明白,最近看了一篇文章我才理清了一點點思路,最近整日沉迷于肥宅快樂水,技術都跟不上了,來篇文章,提神醒腦,朝著我的富婆夢更近一步,早日走上富婆路,包養(yǎng)我家大狼狗?。。?為什么有模塊概念...
閱讀 2746·2021-11-16 11:53
閱讀 2814·2021-07-26 23:38
閱讀 2130·2019-08-30 15:55
閱讀 1838·2019-08-30 13:21
閱讀 3750·2019-08-29 17:26
閱讀 3423·2019-08-29 13:20
閱讀 947·2019-08-29 12:20
閱讀 3265·2019-08-26 10:21