关于import export export default 的理解

关于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'

原文地址:https://www.cnblogs.com/fewhj/p/8258810.html