JS_導入導出

MartinDai 發布于2019-08-26 12:18 / 1059人閱讀

摘要：方式導入導出一個文件，可以向外無數個變量，函數，對象，但是的時候，僅僅需要載入一次文件即可。所以，無形之后，會增加一個頂層命名空間。

Node方式導入導出

一個JavaScript文件，可以向外exprots無數個變量，函數，對象，但是require(); 的時候，僅僅需要載入一次JS文件即可。所以，無形之后，會增加一個頂層命名空間。

導入一個空模塊，是一個空對象,一個模塊就是一個對象。

導出方式：

exports, 導出整個式子

module.exports, 導出賦值部分

導入方式：

reuire()

// 導出一個變量
exports.a = 10;

// 導入該變量
let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// { a: 10 }

// 導出一個變量，直接需要變量值使用.
// module.exports = "name";

// 導入該變量
let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// name

// 導出對象
module.exports = {
  name1: 123,
  name2: 456
}

// 導入該變量
let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// { name1: 123, name2: 456 }

// 導出對象
exports.msg = {
  name1: 1,
  name2: 2
}

// 導入該變量
let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// { msg: { name1: 1, name2: 2 } }

// 導出函數
exports.showMsg = function () {
}

// 導入該變量
// let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// { showMsg: [Function] }

// 在 引用結果 需要  通過  變量 引用對象 執行
// var b= require();
// b.showMsg();

// 導出函數
module.exports = function () {
}

// 導入該變量
let b = require("./export")

// 導入的形式 `console.log(b)`輸出導入的值：
// [Function]

// 引入文件的 變量  直接執行

對象,函數常使用的導出方式：module.exports

對應

import "helpers"
// 也稱: require("···")
import Express from "express"
// 也稱: Express = require("···").default || require("···")
import { indent } from "helpers"
// 也稱: indent = require("···").indent
import * as Helpers from "helpers"
// 也稱: Helpers = require("···")
import { indentSpaces as indent } from "helpers"
// 也稱: indent = require("···").indentSpaces

export default function () { ··· }
// 也稱: module.exports.default = ···
export function mymethod () { ··· }
// 也稱: module.exports.mymethod = ···
export const pi = 3.14159
// 也稱: module.exports.pi = ···

ES6和TS方式導入導出

導出：export
導入：import

注意點:

導出和導入，除了使用as之外，變量名相同

導出一個文件，默認是一個空對象

直接使用導入文件定義變量名，直接執行

default導出，在導入的時候可以取任意變量名

export default默認導出模塊不能使用{}對象導出

// 導出一個常量
export const foo = Math.sqrt(2)

// 導入
import { foo } from "./export"
import * as Tools from "./export" // 使用 Tools.foo

function myFunction () {}
// 導出已經聲明的函數
export { myFunction }

導入
import { myFunction } from "./export"

// 多個導出
export function cube(x: number): number {
    return x * x * x
}
const foo: number = Math.PI * Math.sqrt(2)
export { foo } // 導出多個

// 導入
import { cube, foo } from "./export"

// 導出函數
export default function () {}
export default function fun () {}

// 導入
import myFunction from "./export" // 可以取任意變量名
// 如果導出默認，定義函數名或者變量名，或者類名
// 導入的時候可以寫和原來相同名字，也可以取任意變量名

// 導出類
export default class {}

// 導入
import Test from "./export"

一個文件（模塊）默認的導出只能有一個，可以是類，函數，對象等

導入整個模塊的內容，在當前作用域插入export變量，包含export文件中全部導出綁定(包括export default):

// 導出多個模塊
export function query () {}
export function update () {}

// 導入
import * as API from "./export"

將整個模塊作為附加功能導入，但是不導入模塊的導出成員:

import "my-module"

GPU云服務器云服務器 js導入導出excel數據導出導入導入導出導入?導出

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

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

深入 CommonJs 與 ES6 Module

摘要：目前主流的模塊規范模塊通用模塊如果你在文件頭部看到這樣的代碼，那么這個文件使用的就是規范實際上就是全局變量這三種風格的結合這段代碼就是對當前運行環境的判斷，如果是環境就是使用規范，如果不是就判斷是否為環境，最后導出全局變量有了后我們的代碼和目前主流的模塊規范 UMD CommonJs es6 module umd 模塊（通用模塊） (function (global, facto...

sanyang 2019-08-23 14:42 評論0 收藏0
es6學習筆記-module_v1.0_byKL

摘要：學習模塊不是對象，而是通過命令顯式指定輸出的代碼，輸入時也采用靜態命令的形式。的模塊自動采用嚴格模式命令用于規定模塊的對外接口，命令用于輸入其他模塊提供的功能。該文件內部的所有變量，外部無法獲取。 es6 學習-module_v1.0 ES6模塊不是對象，而是通過export命令顯式指定輸出的代碼，輸入時也采用靜態命令的形式。 ES6的模塊自動采用嚴格模式 export命令用于規定模...

VishKozus 2019-08-20 14:43 評論0 收藏0
富婆給你說require、import和export

摘要：所有依賴這個模塊的語句，都定義在一個回調函數中，等到加載完成之后，這個回調函數才會運行。目前，主要有兩個庫實現了規范和。這些導出對象用名稱進行區分，稱之為命名式導出。簡單粗暴，富婆給你說，其實我也沒太搞明白，最近看了一篇文章我才理清了一點點思路，最近整日沉迷于肥宅快樂水，技術都跟不上了，來篇文章，提神醒腦，朝著我的富婆夢更近一步，早日走上富婆路，包養我家大狼狗！！！為什么有模塊概念...

cod7ce 2019-08-02 16:16 評論0 收藏0
富婆給你說require、import和export

摘要：所有依賴這個模塊的語句，都定義在一個回調函數中，等到加載完成之后，這個回調函數才會運行。目前，主要有兩個庫實現了規范和。這些導出對象用名稱進行區分，稱之為命名式導出。簡單粗暴，富婆給你說，其實我也沒太搞明白，最近看了一篇文章我才理清了一點點思路，最近整日沉迷于肥宅快樂水，技術都跟不上了，來篇文章，提神醒腦，朝著我的富婆夢更近一步，早日走上富婆路，包養我家大狼狗！！！為什么有模塊概念...

sourcenode 2019-08-23 17:18 評論0 收藏0
這幾個概念你可能還是沒搞清require、import和export

摘要：如果這個模塊還依賴其他模塊，那么函數的第一個參數，必須是一個數組，指明該模塊的依賴性。目前，主要有兩個庫實現了規范和。這些導出對象用名稱進行區分，稱之為命名式導出。簡單粗暴，富婆給你說，其實我也沒太搞明白，最近看了一篇文章我才理清了一點點思路，最近整日沉迷于肥宅快樂水，技術都跟不上了，來篇文章，提神醒腦，朝著我的富婆夢更近一步，早日走上富婆路，包養我家大狼狗！！！為什么有模塊概念理想情況...

only_do 2019-05-23 16:26 評論0 收藏0