ES6规范中的import和export踩坑

ES6规范中的import和export踩坑

各浏览器对ES6语法的支持

桌面端浏览器对ES2015的支持情况

• Chrome：51 版起便可以支持 97% 的 ES6 新特性。
• Firefox：53 版起便可以支持 97% 的 ES6 新特性。
• Safari：10 版起便可以支持 99% 的 ES6 新特性。
• IE：Edge 15可以支持 96% 的 ES6 新特性。Edge 14 可以支持 93% 的 ES6 新特性。（IE7~11 基本不支持 ES6）

移动端浏览器对ES2015的支持情况

• iOS：10.0 版起便可以支持 99% 的 ES6 新特性。
• Android：基本不支持 ES6 新特性（5.1 仅支持 25%）

服务器对ES2015的支持情况

• Node.js：6.5 版起便可以支持 97% 的 ES6 新特性。（6.0 支持 92%）

import和export的用法

export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口

import用于在一个模块中加载另一个含有export接口的模块。

也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）
index.html:

<script type="module">
  import {foo, num} from './test.js';

  console.log(num);
  console.log(foo());
</script>

export const num = '123';
export function foo() { return '456';}