module.exports,exports,export和export default,impor

mindwind 發布于2019-08-21 12:03 / 2413人閱讀

摘要：指向的內存有了變化，而指向的內存并無變化，仍為空對象。返回的是而不是。關于和的關系可以總結為初始值為一個空對象，也指向這個空對象返回的是而不是和模塊功能主要由和構成。導出模塊的對外接口，命令導入其他模塊暴露的接口。

基本問題

module.exports和exports是屬于CommonJS模塊規范，導出模塊！

export和export default是屬于ES6語法，導出模塊！

同樣import和require分別屬于ES6和CommonJS，導入模塊！

module.exports和exports

每一個Node.js執行文件，都自動創建2個對象 exports 和 module, module 又有一個屬性 exports, 這個exports 屬性指向一個空對象 {}; 同時 exports這個對象也指向了這個空對象{}。

exports => {} <=module.exports

exports和module.exports指向同一塊內存，但require()返回的是module.exports而不是exports。

var str = "difference"
exports.a = str;
exports.b = function () {
        ////////
}

給 exports 打點添加屬性其實也是給 module.exports 這個空對象打點添加了兩個屬性而已，上面的代碼相當于：

var str = "difference"
module.exports.a = str;
module.exports.b = function () {
        ////////
}

來看下exports和module.exports的使用

使用exports

//app.js

var s = require("./log");
s.log("hello");

//log.js

exports.log =function (str) {
    console.log(str);
}

使用module.exports

//app.js

var s = require("./log");
s.log("hello");

//log.js

module.exports =function (str) {
    console.log(str);
}

上述兩種用法都沒問題，但如果這樣使用

 exports = function (str) {
    console.log(str);
}

運行程序就會報錯。

前面的例子中給 exports 打點添加屬性，只是對 exports 指向的內存做了修改。而上例則是對exports指向的內存進行了覆蓋，使exports指向了一塊新的內存，這樣，exports和module.exports指向的內存并不是同一塊，exports和module.exports并無任何關系。exports指向的內存有了變化，而module.exports指向的內存并無變化，仍為空對象{}。

require得到的會是一個空對象，則會有

TypeError: s.log is not a function

再看下面的例子

//app.js

var x = require("./init");
console.log(x.a)

//init.js

module.exports = {a: 2}
exports.a = 1

運行app.js會有輸出

module.exports通過賦值方式已經和exports對象指向的對象不同了，exports對象怎么改和module.exports對象沒關系了。require()返回的是module.exports而不是exports。

關于exports和module.exports的關系可以總結為

module.exports 初始值為一個空對象 {}，exports也指向這個空對象

require() 返回的是 module.exports 而不是 exports

export和export default

模塊功能主要由：export和import構成。export導出模塊的對外接口，import命令導入其他模塊暴露的接口。

export其實和export default就是寫法上面有點差別，一個是導出一個個多帶帶接口，一個是默認導出一個整體接口。使用import命令的時候，用戶需要知道所要加載的變量名或函數名，否則無法加載。這里就有一個簡單寫法不用去知道有哪些具體的暴露接口名，就用export default命令，為模塊指定默認輸出。

使用export

// testA.js
var f = "Miel";
var name = "Jack";
var data= 1988;

export {f, name, data};

使用export命令定義了模塊的對外接口以后，其他 JS 文件就可以通過import命令加載這個模塊。

// main.js
import {f, name, data} from "./testA";

使用export default

// export-default.js
export default function () {
  console.log("foo");
}

// 或者寫成

function foo() {
  console.log("foo");
}
export default foo;

// import-default.js
import customName from "./export-default";
customName(); // "foo"

下面比較一下export default和export 輸出。

// 第一組
export default function car() { // 輸出
  // ...
}

import car from "car"; // 輸入

// 第二組
export function car2() { // 輸出
  // ...
};

import {car2} from "car2"; // 輸入

可以看到第一組是使用export default，import語句不需要使用大括號；第二組使用export，對應的import語句需要使用大括號，一個模塊只能有一個默認輸出，所以export default只能使用一次。

GPU云服務器云服務器 Exporting exported exports exporter

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/87396.html

從零開始搭建一個React項目

摘要：優化代碼拆分從入口文件開始，遞歸地構建了整個應用的模塊依賴圖表，然后通常會將所有的模塊打包成一個。如果你還不知道什么是React，請點擊這里github源碼安裝Node.js 如果你還不知道什么是ECMAScript，請點擊這里如果你還不知道什么是Node.js，請點擊這里下載Node.js并安裝；接著打開windows命令行窗口分別輸入node -v及npm -v如下圖所示，...

HollisChuang 2019-08-23 12:19 評論0 收藏0
exports、module.exports和export、export default到底是咋回事

摘要：前言難得有空，今天開始重新規范的學習一下編程。簡而言之，區分他們之間的區別就是只是的引用，輔助后者添加內容用的。導出了方法導出了集合成對象導出因為導出是把零散的聚集在一起作為一個對象，而是導出為屬性。前言難得有空，今天開始重新規范的學習一下node編程。但是引入模塊我看到用 require的方式，再聯想到咱們的ES6各種export 、export default。阿西吧，頭都大...

Jaden 2019-08-20 18:26 評論0 收藏0
JavaScript中AMD和ES6模塊的導入導出對比

摘要：每個模塊內部，變量代表當前模塊。這個變量是一個對象，它的屬性即是對外的接口。加載某個模塊，其實是加載該模塊的屬性。為了方便，為每個模塊提供一個變量，指向。這等同在每個模塊頭部，有一行這樣的命令。我們前端在開發過程中經常會遇到導入導出功能，在導入時，有時候是require，有時候是import在導出時，有時候是exports，module.exports，有時候是export，expo...

劉明 2019-08-23 16:21 評論0 收藏0
前端模塊化雜記

摘要：入口模塊返回的賦值給總結在剖析了整體的流程之后，可以看到相關的技術細節還是比較清晰的，學無止境引用混合使用詳解的語法前端模塊化規范前言 CMDAMD簡介 Commonjs簡介 Module簡介 Common和Module的區別 Module與webpack Module與Babel 一些問題總結引用前言前端模塊化在近幾年層出不窮，有Node的CommonJs,也有屬于cl...

GitCafe 2019-08-26 13:29 評論0 收藏0
node中模塊導入和導出的探究

摘要：模塊的文件名，帶有絕對路徑。返回一個布爾值，表示模塊是否已經完成加載。返回一個對象，表示調用該模塊的模塊。表示模塊對外輸出的值。我們在編寫js過程中，經常會碰到 requrie和import的寫法，也會看到export default，exports的寫法，他們能不能混用呢，我們來探究一下當前環境： node版本 v9.6.1 操作系統 Mac module 我們打印出modul...

Anshiii 2019-08-22 16:12 評論0 收藏0