前端模块化

1
2
3
4
5
6
7
为了代码的复用,es6中也有导入导出的方式,可以将复用的js代码进行抽取。

新建一个文件,在该文件中定义一些变量或函数
使用export{变量名1,变量名2}
import '变量名1' from '文件路径';

简单的说前端就是通过导出的方式去判断是内部函数或变量还是外部可以调用的方式。

使用方式

1
2
3
1.html:<script src="info.js" type="module"/> #引入js文件
2.两个js互相导入导出
import {s,b,c} from '文件路径' # 引入default关键字的变量不需要加大括号

导出方式

1
2
3
4
5
6
7
8
9
1.在需要导出的函数名前加export
export function 变量名

2.先定义好,定义好后集体导出
export{函数1,函数2}

3.让导入者自己命名
export default aaa # 只能有一个default
import bbb from '文件名' 将前端有default的重命名成了bbb(不需要大括号)