在ES6中我们可以通过export导出一个模块，有一下几种方法：
1.1 export default xx ，默认导出一个模块
[AppleScript] 纯文本查看 复制代码
|
1
2
3
|
export default function
(
a
,
b
)
{
console.
log
(
a
+
b
)
;
}
|
在另一个页面导入这个js文件：
[AppleScript] 纯文本查看 复制代码
|
1
2
|
/
/
import a
from
"./base.mjs"
;
/
/
a
(
1
,
2
)
;
|
这里我们要注意的是，此处我们引入的是export default默认的模块，所以我们这里要给引入的东西起一个名字。
1.2 注意，一个文件只能export default 一次 ，如果多次导出default就会报错
Identifier '*default*' has already been declared
显示default已经被声明的错误。
1.3 export default {} 还可以导出一个对象模块
[AppleScript] 纯文本查看 复制代码
|
1
2
3
4
5
6
|
export default
{
name
:
"jack"
,
tell
:
function
(
)
{
console.
log
(
this.
name
)
;
}
}
;
|
在引入代码的地方依旧是起一个别名
[AppleScript] 纯文本查看 复制代码
|
1
|
import a
from
'base.mjs'
|
1.4 如果要导出多个数据，可以使用export xx
比如：
[AppleScript] 纯文本查看 复制代码
|
1
|
export const a
=
function
(
)
{
}
|
注意： 这种可以导出很多个
1.5 上述代码是直接在导出声明，你也可以先声明，再一起导出：
[AppleScript] 纯文本查看 复制代码
|
1
2
3
4
5
6
|
/
/
4.
export 可以 导出一些其他数据
const
name
=
"harry"
;
const age
=
19
;
/
/
错误写法 要么直接声明在export中要么用类对象的形式表示
/
/
export
name
,
age
export
{
name
,
age
}
;
|
注意： 不过export name,age的写法是错误的 。要用一个类似对象的格式接收要导出的对象。
1.6 在导入页面：
我们可以同时引入 default暴露的数据和export的数据
[AppleScript] 纯文本查看 复制代码
|
1
2
3
4
5
|
/
/
可以和default导入的模块共存
/
/
使用es
6
的解构方式把导出的数据传递出来
/
/
import
{
name
,
age
}
from
"./base"
;
/
/
也可以简写到一起
/
/
import a
,
{
name
,
age
}
from
"./base"
;
|
1.7 可以起一个别名：
[AppleScript] 纯文本查看 复制代码
|
1
2
3
|
/
/
也可以导出部分属性 用别名表示 及时和a重名也没关系
/
/
import
{
name
as
a
,
age
}
from
"./base"
;
/
/
console.
log
(
a
)
;
|
但是不可以重名。
1.8 如果想导入全部数据：
[AppleScript] 纯文本查看 复制代码
|
1
2
3
4
|
/
/
一次性大丰收 获取全部数据
/
/
但是由于我们导出的模块不是当前页面全部都要用到，所以不建议使用这种全部导入的方式，选择按需导入 es
6
的解构方式会好很多
import
*
as
a
from
"./base"
;
console.
log
(
a
)
;
|
最后： 在node中，es6中的module语法处于试验阶段，所以在node中运行的代码要把后缀名js 改成 mjs