es6 import & export

前言：ES6把js文件当做模块处理
一、export & import
示例1：
导出一个变量

//test.js
var name = "Amy";
export {name};

//写法2 （注意导入变量写法）
var name = "Amy";
export {name as anotherName};

//写法3
export var name = "Amy";

//反模式
var name = "Amy";
export name; //export输出的是接口，现在输出值，所以不可以。

导入变量

import {name} from 'test'

//针对导入写法2
import {anotherName} from 'test'

示例2：
导出一组变量

//test.js
var name = "Amy";
var age = "20";
export {name, age};

//写法2
export {name};
export {age};

导入一组变量

//写法1
import {name, age} from 'test'

//写法2
import * as test from 'test'
test.name;

//写法3 module指令 （等同于写法2）
module test from 'test'
test.name;

示例3：
导出函数

//test.js
export function f1() {...};
export function f2() {...};

示例4：
导出默认模块
默认模块只能有一个，export default只是输出一个叫default的变量，所以default后接任何变量名，都视为匿名

//test.js
export default function f1() {...};

//写法2
function f1() {...}
//不用加花括号{}，export default f1是将f1赋值给default
export default f1;

//反模式
export default var a = "Amy";

导入默认模块

//不用加花括号{}
import f1 from 'test'

示例5：
导出匿名默认模块

//test.js
export default function () {...};

导入匿名默认模块

//import 可以为该匿名模块指定任意名字
import anyName from 'test'

示例6：
同时导出非默认和默认模块

//test.js
var name = "Amy";
var age = 20;
export default name;
export {age};

同时导入非默认和默认模块

import name, {age} from 'test'

二、import

• import会执行所加载的模块

import 'test'
//执行test，但不导入任何变量

三、总结

• import
  
  • 非默认模块加花括号 import {notDefaultName} from 'fileName'
  • 默认模块不加花括号 import defaultName from 'fileName'
• export
  
  • 非默认模块加花括号 export {notDefaultName} 或 导出声明 export var a = 0
  • 默认模块不加花括号 export default defaultName，实质导出变量default

四、参考文献
阮一峰 ES6 import export