es6 import & export

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

//test.jsvar name = "Amy";export {name};//写法2 （注意导入变量写法）var name = "Amy";export {name as anotherName};//写法3export var name = "Amy";//反模式var name = "Amy";export name; //export输出的是接口，现在输出值，所以不可以。

导入变量

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

示例2：
导出一组变量

//test.jsvar name = "Amy";var age = "20";export {name, age};//写法2export {name};export {age};

导入一组变量

//写法1import {name, age} from 'test'//写法2import * as test from 'test'test.name;//写法3 module指令 （等同于写法2）module test from 'test'test.name;

示例3：
导出函数

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

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

//test.jsexport default function f1() {...};//写法2function f1() {...}//不用加花括号{}，export default f1是将f1赋值给defaultexport default f1;//反模式export default var a = "Amy";

导入默认模块

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

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

//test.jsexport default function () {...};

导入匿名默认模块

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

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

//test.jsvar 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