es6之前，社区模块加载方案，主要是CommonJS(用于服务器)和AMD(用于浏览器)
而es6实现的模块解决方案完全可以替代CommonJS和AMD
ES6模块设计思想：尽量静态化，在编译时就能确定模块的依赖关系，以及输入输出的变量
而CommonJS和AMD模块，都只能在运行时确定这些东西
同时：模块中使用的是严格模式
<script type="module" src="es7-1.js" ></script> <script type="module" src="es7-2.js" ></script> <!-- 页面渲染完成再去加载，相当于设置了defer，不会造成浏览器阻塞 -->
用script引入模块文件时，需要加上type="module"
这里补充一下defer和async属性：
1 <script src="a.js" async></script>
设置了async属性后，浏览器加载页面的过程是：渲染引擎开始渲染，发现设置async属性的脚本，继续渲染，同时下载脚本，当脚本下载完成，渲染引擎将浏览器控制权脚本JS引擎，执行脚本。因为可能会遇见多个脚本，同时脚本的下载时间有长有短，所以脚本执行顺序可能不是脚本书写的顺序！
设置defer属性，浏览器的工作情况：前面与上面类似，不过当发现脚本，渲染引擎会继续渲染页面，直到页面渲染完成，再将浏览器控制权交给JS引擎，执行脚本；所以脚本执行顺序与脚本书写的顺序一致。这种与在页面底部引入的脚本文件作用类似！
如果均未设置以上属性，浏览器工作情况：渲染引擎开始渲染，发现脚本，将浏览器控制权脚本js引擎，下载脚本，执行脚本，结束后JS引擎再将浏览器控制权交给渲染引擎，渲染引擎继续渲染。。。
export：导出变量，函数，类等
第一种写法：
1 export let name=‘apple‘ 2 export let age=100 3 export let year=2017
第二种写法：更推荐（在最下面使用export导出，能看出究竟哪些变量或其他类型被导出，更直观）
1 let name1=‘apple‘
2 let age1=100
3 let year1=2017
4 export {name1,age1,year1}
还可以用as重命名，类似sql语句
1 export {name1 as a,age1 as b}
注意下面这种情况：
1 let a1=function (){}
2 // export a1//错误的写法
3 export {a1}
也就是说export时要提供对外的接口
1 export function f(){}//正确写法
2 function f1(){}
3 // export f1//错误写法
同时注意：export必须放在模块顶层，不得放入块级作用域内(报错),因为无法做静态优化;
export default可以用在匿名函数之前；当然也可以放在不是匿名函数之前
1 export default function(){}
2 // 而导入时，可以import abc from ‘./es7-2‘ 注意此时的abc没有用大括号括起来，abc可以为任意有效变量名
3 // 总体来说export default后， import后面可以加上任意变量名，比较方便
import：当export导出了模块的对外接口，此时就可以用import导入接口(加载导出的模块)
1 import {name1,age1,year1} from ‘./es7-1.js‘
2 console.log(name1,age1,year1)//apple 100 2017
3 // form后面路径可以是相对路径也可以是绝对路径，.js后缀可以省略
4 // 但是我开apache时，省略js报错了，同时如果script是行内引用的话，必须加.js后缀，所以建议任何时候都加上后缀
同理import导入时也可以用as重命名:
1 import {name1 as a1}
同时由于import是静态执行,所以不得对import使用表达式、变量等操作；因为这些都是在运行时执行，并不是编译时(静态)执行