一： export和import的正常用法
1：export变量

// ./module/example.jsexport var firstName = 'roger';export const lastName = 'waters';export let dob = 1944;// index.jsimport  {firstName, lastName, dob} from './module/example.js';

2：export方法

// ./module/example.js//定义方法的时候，就可以exportexport function sum(a, b) {    return a + b;}function multiply(a, b) {    return a * b;}//也可以先定义，再exportexport { multiply };

在别的文件里面import上面2个方法，是一样的

//./index.jsimport  {sum, multiply} from './module/example.js';

3：export重命名
有时候你也许不想用一个变量，方法，类的原本的名字，而是想换一个别的名字。那么你可以使用 as
，而且在export和import的时候都可以，例如：

// ./module/example.jsfunction sum(a, b) {    return a + b;}export {sum as add};//./index.jsimport  {add} from './module/example.js';

4: import重命名
在第三点里面，我们看到了可以在export的时候重命名变量。同样的效果，也可以在import的时候做，依然是用as：

// ./module/example.jsfunction sum(a, b) {    return a + b;}export {sum};//./index.jsimport  {sum as add} from './module/example.js';//此时在index.js里面可以被使用的方法是add()，而不是sum()

5：export default
我们可以给一个js module制定默认值，也就是这里的default。导出一个default和前面我们讲到的导出一个变量一样也是有三种方式：

  1. 在定义的时候export

       //./module/example.js   export  default  function(a, b) {       return a + b;   }      //./index.js   import  sum  from './module/example.js';

export的可以是一个匿名函数，在导入的时候，用任意合理的名字代表默认导出，但是注意与非default变量的区别在于，这里没有花括号({})

  1. 先定义再export

       //./module/example.js   function sum(a, b) {       return a + b;   }   export default sum;      //./index.js   import  sum  from './module/example.js';

在import的时候，依然可以是任意的合理的变量名，不一定得是sum。

  1. 使用 as

       //./module/example.js   function sum(a, b) {       return a + b;   }   export {sum as default}   //./index.js   import  sum  from './module/example.js';

在import的时候，依然可以是任意的合理的变量名，不一定得是sum。

6：export default和其他变量一起
一个module可以export default的同时export其他变量，语法与只export其中一样没有区别；只是在import的时候，default一定要在非default前：

//./module/example.jsexport var firstName = 'roger';export const lastName = 'waters';export let dob = 1944;function sum(a, b) {    return a + b;}export {sum as default}// ./index.js//语法正确import  sum, {firstName, lastName, dob}  from './module/example.js';//error: 语法错误import  {firstName, lastName, dob}, sum  from './module/example.js';

7: import *
当我们想把一个module所有export的东西都一次性import的时候，就可以使用 import * as

// ./module/example.jsexport var firstName = 'roger';export const lastName = 'waters';export let dob = 1944;function sum(a, b) {    return a + b;}export {sum as default}//./index.jsimport  * as example  from './module/example.js';console.log(example.firstName);console.log(example.lastName);console.log(example.dob);example.default(1, 2);

这里特别注意的是，这里的example.default就是我们export的default变量。

8：export import
我们可以把从别的module导入的变量作为本module的导出。例如下面的例子./mian.js从./idnex.js导入变量firstName, 而firstName原本是./index.js从./module/example.js导入的：

//./module/example.jsexport var firstName = 'roger';export const lastName = 'waters';export let dob = 1944;function sum(a, b) {    return a + b;}export {sum as default}//./index.jsimport {firstName}  from './module/example.js';export {firstName};//./main.jsimport {firstName} from './index.js'

在./index.js文件里的2行代码等同于下面的一行：

export {firstName} from './module/example';

这个时候也可以使用 as:

export {firstName as nickName} from './module/example';

也可以使用 *

export * from './module/example';

export *的时候，是不包含default的。如果我们想要包含default,得单独导入和导出default：

//./module/example.jsexport var firstName = 'roger';export const lastName = 'waters';export let dob = 1944;function sum(a, b) {    return a + b;}export {sum as default}//./index.jsexport * from './module/example';import sum from './module/example';export {sum};//./main.jsimport {firstName, lastName, dob} from './index.js'import {sum} from './index'

二：export和import的注意点可能的错误
1：在没有default的情况下，不能export匿名函数
2：export和default都只能用到module的最高层scope
3：module的影响是全局的