关于import, export, export default 的理解与异同
一、这三个词是es6语法里是关于模块引用的词,可以引用一个变量,也可以是一个json ,也可以是一个函数,或者模块,那如何使用呢?在一个html文件里面可以直接使用吗?答案是不可以,你必须通过打包工具webpack,glup等配合babel使用。
export用于对外输出本模块(一个文件可以理解为一个模块)变量的接口
import用于在一个模块中加载另一个含有export接口的模块。
二、import export 在一个文件中可以出现多次,而export default 在一个文件中只能出现一次
三、使用方法
1. a.js
var name = 'whj';
方式一:export {name} //正确
eg : 错误事例 export name // 错误,这样相当于导出了字符串'whj';
方式二:export default name //正确
2. b.js
对于方式一的导入方式 import {name} from './a.js'
对于方式二的导入方式:import name/name1/name2 from './a.js'
3. 对于导出多个变量
var a = 1;
var b = 2;
var c = function () {
return "我是函数c"
}
导出方式一:export {a, b, c}
导出方式二: export {a}
export {b}
export {c}
导入方式一: import {a} from './a.js'
import {b} from './a.js'
import {c} from './a.js'
导入方式二:import {a, b, c} from './a.js'