码迷,mamicode.com
首页 > 其他好文 > 详细

[ES6]import 与export的用法 ,export 与export default 的 区别 以及用法

时间:2018-08-23 13:04:29      阅读:417      评论:0      收藏:0      [点我收藏+]

标签:var   class   style   bsp   name   imp   function   efault   rom   

一、import 与export

export(导出):用于对外输出本模块(一个文件可以理解为一个模块)变量的接口;

import(导入):用于在一个模块中加载另一个含有export接口的模块。

 

1.一个a.js文件有如下代码:

a.导出单个变量:

export var name="李四";

b.导出多个变量:

var name1="李四";
var name2="张三";
export { name1 ,name2 }

c.导出函数:

function add(x,y){
   alert(x*y)
}
export { add }

 

 

2.在其它文件里引用如下:

a.导入单个变量:

import { name } from "/.a.js"

b.导入多个变量:

import { name1 , name2 } from "/.a.js"

c.导入函数:

import { add } from "/.a.js"

 

二、export与export default的区别

1.在一个文件或模块中,export、import可以有多个,export default仅有一个,即:

 

var name1="李四";
var name2="张三";
export { name1 ,name2 }

也可写作:

var name1="李四";
var name2="张三";
export name1;
export name2;

 

2.通过export方式导出,在导入时要加{ },export default则不需要

var name="李四";
export { name };
import { name } from "/.a.js";

用export default可以写作:

var name="李四";
export default name;
import name from "/.a.js"; //这里name不需要大括号

 

[ES6]import 与export的用法 ,export 与export default 的 区别 以及用法

标签:var   class   style   bsp   name   imp   function   efault   rom   

原文地址:https://www.cnblogs.com/vickylinj/p/9523053.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!