ES Modules 基本特性
- 自动采用严格模式，忽略'use strict'
- 每个ES Modules模块都是单独的私有作用域
- ES Modules是通过CORS去请求外部JS模块
- ES Modules的script标签会延迟执行脚本
ES Modules 导入、导出
导入用 import 导出用 export
因为Module里面都是私有作用域，所以外部无法直接访问到里面的成员，通过export 修饰成员可以将成员导出
export var name = 'tom'
导入时用import，import的时候自动请求对应的文件，并且提取里面export的成员
import { name } from './test.js'
可以用as来起别名 导入时就要用别名
export { name as personName }
import { personName } from './test.js'
export 可以导出任意的成员，常用做法是在文件结尾一次性导出需要的成员
export { name, age, helloFun }
导出default 会作为模块的默认导出,default 后面是个值
导入时可以不指定成名 导入默认成员
export default name
import otherName from './test.js'
- export 和 import 中 {} 是一种语法格式 不是 对象和解构，是固定格式的写法
- export导出是成员本身，而不是引用，如果导出后成员发生变化，导入的值也会变化
- import的成员是只读的
导入的用法
import { name } from './module.js' // 后缀不能省略
import { name } from './module.js' // 要用相对路径
import { name } from 'vue' // 不以/开头会认为是导入node_module的模块
import { name } from 'http://aaaa/modeule.js' // 可以是网络路径 cdn的模块
import './module.js' // 执行模块 不提取成员
import * as mod from './module.js' // 提取全部成员到mod中 成员是mod的属性
import 关键字只能用在代码开头 不能用条件控制 引入的内容要运行前确定
// 动态导入
import('./module.js').then(function (module) {})
// 导入默认成员和命名成员
export { name, age }
export default 'title'
import title, { name, age } from './module.js' // {}里面是命名成员 前面是默认成员
