require導(dǎo)入module.exports 或 exports導(dǎo)出的使用方法
一、CommonJS 的導(dǎo)入和導(dǎo)出
1.定義
CommonJS 是一種用于 JavaScript 的模塊化規(guī)范,用于在服務(wù)端環(huán)境和舊版瀏覽器中組織和管理代碼。它定義了模塊的導(dǎo)入(require)和導(dǎo)出(module.exports 或 exports)方式,并支持同步加載模塊。
2.特點(diǎn)和使用方法
1.導(dǎo)入模塊:
使用 require 函數(shù)來(lái)導(dǎo)入模塊。
可以通過(guò)相對(duì)路徑或絕對(duì)路徑指定要導(dǎo)入的模塊文件。
返回被導(dǎo)出的模塊內(nèi)容。
2.導(dǎo)出模塊:
使用 module.exports 或 exports 對(duì)象導(dǎo)出模塊內(nèi)容。
可以導(dǎo)出變量、函數(shù)、對(duì)象或其他模塊。
module.exports 是導(dǎo)出整個(gè)模塊的內(nèi)容,而 exports 是 module.exports 的一個(gè)引用。
3.同步加載:
require 函數(shù)是同步的,會(huì)阻塞后續(xù)代碼的執(zhí)行直到模塊加載完畢。
適用于在服務(wù)器環(huán)境中加載本地模塊或在舊版瀏覽器環(huán)境中加載模塊。
4.動(dòng)態(tài)加載:
可以在運(yùn)行時(shí)根據(jù)需求動(dòng)態(tài)加載模塊。
5.塊級(jí)作用域:
CommonJS 模塊使用立即執(zhí)行函數(shù)表達(dá)式(IIFE)封裝,每個(gè)模塊都具有自己的作用域。
模塊內(nèi)定義的變量和方法默認(rèn)是私有的,不會(huì)暴露到全局作用域。
// 導(dǎo)出模塊內(nèi)容
module.exports = {
variable1: value1,
myFunction: function() { /* 函數(shù)體 */ }
};
// 導(dǎo)入模塊
const myModule = require('./myModule');
// 使用導(dǎo)入的模塊內(nèi)容
console.log(myModule.variable1);
myModule.myFunction();
需要注意的是,在瀏覽器環(huán)境中,CommonJS 模塊需要使用打包工具(如 Browserify、Webpack)將其轉(zhuǎn)換為瀏覽器可識(shí)別的格式,或者使用庫(kù)(如 RequireJS)來(lái)加載和管理模塊。三、具體使用
在 CommonJS 模塊系統(tǒng)中,module.exports 和 exports 是指向同一個(gè)對(duì)象的引用,但不能直接將 exports 賦值為新對(duì)象或值,因?yàn)樗皇?module.exports 的一個(gè)引用。如果想要導(dǎo)出一個(gè)新的對(duì)象或值,請(qǐng)使用 module.exports。
1.導(dǎo)出單個(gè)變量、函數(shù)或?qū)ο?/h3>
module.exports = myVariable;
//或者
exports.myVariable = myVariable;
module.exports = myVariable; //或者 exports.myVariable = myVariable;
2.導(dǎo)出多個(gè)變量、函數(shù)或?qū)ο?/h3>
module.exports = {
variable1: value1,
variable2: value2,
myFunction: function() { /* 函數(shù)體 */ }
};
//或者
exports.variable1 = value1;
exports.variable2 = value2;
exports.myFunction = function() { /* 函數(shù)體 */ };
module.exports = {
variable1: value1,
variable2: value2,
myFunction: function() { /* 函數(shù)體 */ }
};
//或者
exports.variable1 = value1;
exports.variable2 = value2;
exports.myFunction = function() { /* 函數(shù)體 */ };3.通過(guò)賦值給 exports 對(duì)象導(dǎo)出:
module.exports = {
variable1: value1,
variable2: value2,
myFunction: function() { /* 函數(shù)體 */ }
};
//或者
exports.variable1 = value1;
exports.variable2 = value2;
exports.myFunction = function() { /* 函數(shù)體 */ };4.導(dǎo)入
//在 CommonJS 中,使用 require 導(dǎo)入模塊時(shí),會(huì)返回被導(dǎo)出的內(nèi)容
const myModule = require('./myModule');module.exports:用于導(dǎo)出整個(gè)模塊的內(nèi)容。可以通過(guò)賦值給 module.exports 導(dǎo)出一個(gè)對(duì)象、函數(shù)或值。導(dǎo)出的內(nèi)容可以被其他模塊通過(guò) require 導(dǎo)入。例如:module.exports = myVariable;
exports:是 module.exports 的一個(gè)引用,并且可以通過(guò)添加屬性和方法來(lái)導(dǎo)出多個(gè)值。當(dāng)使用 exports.variable = value 導(dǎo)出時(shí),實(shí)際上是在修改 module.exports 對(duì)象,將變量作為其屬性添加進(jìn)去。例如:exports.myFunction = function() { /* 函數(shù)體 */ };
需要注意的是,module.exports 和 exports 是同一份內(nèi)存空間的引用,因此直接給 exports 賦予一個(gè)新的對(duì)象或值并不會(huì)更改 module.exports 的引用。所以,如果要導(dǎo)出一個(gè)新的對(duì)象或值,應(yīng)該使用 module.exports。
到此這篇關(guān)于require導(dǎo)入module.exports 或 exports導(dǎo)出的使用的文章就介紹到這了,更多相關(guān)require導(dǎo)入module.exports內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript讀二進(jìn)制文件并用ajax傳輸二進(jìn)制流的方法
這篇文章主要介紹了JavaScript讀二進(jìn)制文件并用ajax傳輸二進(jìn)制流的方法的相關(guān)資料,需要的朋友可以參考下2016-07-07
js實(shí)現(xiàn)window.open不被攔截的解決方法匯總
這篇文章主要介紹了js實(shí)現(xiàn)window.open不被攔截的解決方法,實(shí)例匯總了常用的不被攔截的解決方法,需要的朋友可以參考下2014-10-10
JavaScript JSON.stringify()的使用總結(jié)
JSON是一種輕量級(jí)數(shù)據(jù)格式,可以方便地表示復(fù)雜數(shù)據(jù)結(jié)構(gòu)。JSON對(duì)象有兩個(gè)方法:stringify()和parse()。在簡(jiǎn)單的情況下,這兩個(gè)方法分別可以將JavaScript序列化為JSON字符串,以及將JSON解析為原生JavaScript值。本文著重介紹JSON.stringify()的使用方法和注意事項(xiàng)。2021-05-05
JavaScript定義簡(jiǎn)單的頁(yè)面復(fù)選框?qū)崿F(xiàn)全選操作
本文主要介紹了JavaScript定義簡(jiǎn)單的頁(yè)面復(fù)選框?qū)崿F(xiàn)全選操作,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
JavaScript?12個(gè)有用的數(shù)組技巧
數(shù)組是Javascript最常見(jiàn)的概念之一,它為我們提供了處理數(shù)據(jù)的許多可能性,熟悉數(shù)組的一些常用操作是很有必要的。本文將為大家介紹12個(gè)有用的JavaScript數(shù)組技巧,需要的朋友可以參考一下2021-12-12
JavaScript利用crypto模塊實(shí)現(xiàn)加解密
crypto模塊提供了加密功能,包含對(duì) OpenSSL 的哈希、HMAC、加密、解密、簽名、以及驗(yàn)證功能的一整套封裝。本文將利用它實(shí)現(xiàn)加解密算法,需要的可以參考一下2023-02-02

