一、ES6简介
ECMAScript 6是JavaScript语言的标准,简称ES6。编写符合ES6规范的JavaScript代码能够提高程序的可读性,提高代码的可利用性。
二、ES6模块化基本语法
1. 默认导入与默认导出
- 默认导出语法 export default {}
- 默认导入语法 import 名称 from '模块标识符’
默认导出实例
let a = 10
let b = 20
let c = 30
function show() {
console.log('11111123')
}
export default {
a,
c,
show
}
默认接收实例
// console.log('ok')
import m1 from './m1'
console.log(m1)
默认导出的a, c, show都可以被默认导入接收到,而没有导出的c无法被接收。
2. 按需导出和按需导入
- 按需导出语法export let a = 10
- 按需导入语法 import {a, b, …} from '模块标识’
按需导出实例
export let s1 = 'aaa'
export let s2 = 'bbb'
export let s3 = 'ccc'
按需导入实例
import { s1, s2, s3 } from './m1'
console.log(s1)
console.log(s2)
console.log(s3)
- 细节,按需导入时,还可以通过as关键字起别名
import { s1, s2 as a, s3 } from './m1'
// console.log(m1)
console.log(s1)
console.log(a)
console.log(s3)
运行结果没有变化
3. 直接执行导入模块代码
这个概念有点类似于匿名对象的使用,即不需要接收,只需要执行模块中的代码
实例
for (let i = 0; i < 10; i++) {
console.log(i)
}
import './m2.js'
import './m2.js’后m2中的代码被执行了