JS_导入导出

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'
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值