已发ES6文章：

1~14 点这里

15 可暂停的函数 Generator

16 Promise （一）

17 Promise （二）

18 类

19 类的静态方法和属性

module 解决了 JS 代码模块化的问题

以前通过html引用不同的js文件来实现代码模块化，但依赖于html，JS文件并不能引用JS文件。

AMD的模块化方式在ES6之后将被替换，而且效率不如ES6的方式。

模块的概念

模块功能主要由 export 和 import 组成，而且很简单：

JavaScript文件内通过 export 关键字导出一些变量，供其他文件使用 import 命令导入变量

exprot

模块导出变量，语法：

• 单个导出，在变量前加 export

export var name='JavaScript';

export class myToutiao{...};

• 放在文件末尾，写在一个对象里，一起导出（建议使用这种）

export {

　name,

　myToutiao

}

注：

export内可使用as关键字重命名

export * 可以导出全部

export {

　name as moduleName

}

import

模块导入指定变量，语法：

• 导入多个

import {变量名1, 变量名2, ...} from ‘文件路径’

import {

　name,

　myToutiao as Tt

} from 'xx'

注：

文件路径不需要指定.js

变量名必须和导出的一致

导入的变量可使用as重命名

import会被提升到顶部先执行

• 导入全部

import * as ‘对象名’ from ‘文件路径’

此方式会把所有变量放在一个对象里

import * test from 'xx'

test.name;

小技巧：还有一种全部导入的方法更为便捷： module 对象名 from 文件路径

export default

模块默认导出，一个模块只能有一个默认导出，导入时import不可以加{}，好处是无需知道导入模块内的变量名

export default function(){...};

import myfn from 'xx';

模块的本质

导入导出的变量都是动态的，es6 导入的变量是‘只读引用’，如果导出的变量值改变， import的值也跟着动态改变 （即便变量是字符串等非引用类型）

只读的意思是，不可以给导入的变量重新在本模块赋值，但引用类型的变量可以操作其元素