当前位置 > it书童 > 大前端 > 正文
推荐小册
java高效编程
怎样更高效地用 java 编程

juc并发工具库
java并发编程工具库

设计模式
设计模式

jvm调优
jvm调优

rabbitmq实战
rabbitmq实战

redis实战
redis实战

Keepavlied高可用集群
Keepavlied高可用集群

nginx入门到实战
nginx入门到实战

java调试
java调试中遇到的各种坑

java输入输出流
java输入输出流

es6模块化设计-module

大前端 it书童 2020-10-06 18:05:31 0赞 0踩 368阅读 0评论

导出可以是变量、函数、类

导出一个变量

定义 mod.js 为导出的模块,用 export 关键字指定导出

export const name = 'hello'

导入模块

import { name } from './mod'
console.log(name)

导出多个变量

export const name = 'hello'
export const addr = '北京'
export var list = [1, 2, 3]

导入

import { name, addr, list } from './mod'
console.log(name, addr, list)

简化写法

const name = 'hello'
const addr = '北京'
let list = [1, 2, 3]

export {
  name,
  addr,
  list
}

default

const name = 'hello'
const addr = '北京'
let list = [1, 2, 3]

// 默认导出 name, 同时导出另外两个变量
export default name
export {
  addr,
  list
}
import name, { addr, list } from './mod'
console.log(name, addr, list)

注意,导入时,name 是在 {} 之外

如果不想用 {} 指定导入,那么导出的一定是默认导出的,即用 export default

自定义模块变量名

default 导出的,在导入时允许我们自定义名称

const name = 'hello'
export default name

导入:

import name2 from './mod'
console.log(name2)

一个文件就是一个模块,一个模块可以导出多个内容,但只能默认导出一个内容

如果要对非默认导出的换名,需要加上 as

import name2, { addr as addr2 } from './mod'
console.log(name2, addr2)
关于我
一个文科出身的程序员,追求做个有趣的人,传播有价值的知识,微信公众号主要分享读书思考心得,不会有代码类文章,非程序员的同学请放心订阅
转载须注明出处:https://www.itshutong.com/articles/772/es6-modular-design-module