【JS笔记】ES6模块

ES6最大的改进就是引入了模块规范。

script 脚本加载顺序与defer、async属性有关，defer-立即下载，但文档解析完成后执行。async-异步下载，加载完后立即执行。

<script type='module' > - 默认“类似”defer。如果想立即下载，立即执行，加上async属性即可。

与<script type = "module" >关联或者通过import语句加载的JavaScript文件会被认定为模块。

模块导入导出：两种导入与两种导出一一对应

导出：

const foo = "string foo";

• 命名导出
  • export { foo };
  • 可以提供别名 - export { foo as myFoo };
• 默认导出

　　　　export default foo ;

　　　　每个模块只有能一个默认导出

 

 

 

 导入：

import 语句会被提升到模块的顶部

import foo from './modeleA.js'

模块标识符 -- 就是import from 后面那一串字符串。在浏览器中通过标识符原生加载模块，则文件必须带有.js扩展名，否则可能无法正确解析。

• 使用命名导出的模块，可以使用*进行批量导入

　　　　export { foo , bar, baz } 

　　　　import * as Foo from './foo.js';

　　　使用：

　　　　Foo.foo;

　　　　Foo.bar;

　　　　Foo.baz;

• 使用默认导出的模块，以下两句话等效
  • import { default as foo } from './foo.js'
  • import foo from './foo.js';