// 一模块的基础知识
/**
* export :用于模块输出的出口
* import :文件引入的入口
*/
// 1,第一种方式使用export方式输出
var
a =
'a';
var
b =
'v';
export {
a,
b };
// 2,使用export作为默认值输出
export {
a
as
streamV1,
b
as
streamV2
};
// 3,export 可以处于任何位置,只要顶端就可以, 不能处于块级作用域
/**
* import 文件模块加载
*/
// 1,直接模块加载
import {
a,
b }
from
'./ass';
// 2,直接模块输出
import
*
as
cricle
from
'./ass'
cricle.
a
// a
/**
* export default 默认输出的命令,import模块加载,不需要{}模块加载
*
*/
// 1、匿名函数直接使用, import可以直接 模块加载,直接输出名字
export
default
function () {
console.
log(
'foo');
}
import
customName
from
'./export-default';
// 2,直接输出函数
function
add(
x,
y) {
return
x *
y;
}
export {
add
as
default }
// 直接相当
export
default
add;
import {
default
as
foo }
from
'./add';
import
foo
from
'./modules'
/**
* export 与 import 的复合写法
*/
export {
foo,
bar }
from
'./my_module';
// 可以简单理解为
import {
foo,
bar }
from
'./my_module';
export {
foo,
bar };
// 二、导出列表
export {
detectCats,
Kittydar };
// no `export` keyword required here
function
detectCats(
canvas,
options) { ... }
class
Kittydar { ... }
// 三、重命名导出和导入
import {
flip
as
flipOmelet }
from
"eggs.js";
import {
flip
as
flipHouse }
from
"real-estate.js"
function
v1() { ... }
function
v2() { ... }
export {
v1
as
streamV1,
v2
as
streamV2,
v2
as
streamLatestVersion
};
// 四、默认的导入、导出
import
colors
from
"colors/safe";
export
default {
field1:
value1,
field2:
value2
};
// 模块对象,像命名空间
import
*
as
cows
from
"cows";
// 聚合模块,它不会在当前作用域中绑定将要导出的变量
export {
Tea,
Cinnamon }
from
"sri-lanka";
/**
* 深入理解 ES6 模块机制 https://zhuanlan.zhihu.com/p/33843378?group_id=947910338939686912
*/