1.export与export default均可用于导出常量、函数、文件、模块等
2.在一个文件或模块中,export、import可以有多个,export default仅有一个
3.通过export方式导出,在导入时要加{ },export default则不需要
4. 
(1) 输出单个值,使用export default
(2) 输出多个值,使用export
(3) export default与普通的export不要同时使用

示例:

 
1.export
//a.js
export const str = "blablabla~";
export function log(sth) {
return sth;
}
对应的导入方式: //b.js
import { str, log } from 'a'; //也可以分开写两次,导入的时候带花括号 2.export default
//a.js
const str = "blablabla~";
export default str;
其实此处相当于为str变量值"blablabla"起了一个系统默认的变量名default,自然default只能有一个值,所以一个文件内不能有多个export default。
对应的导入方式: //b.js import str from 'a'; //导入的时候没有花括号
本质上,a.js文件的export default输出一个叫做default的变量,然后系统允许你为它取任意名字。所以可以为import的模块起任何变量名,且不需要用大括号包含
 
 

import的文件会自动执行一次。

import会加载且仅加载一次导入的模块

ES6模块化与commonjs、amd区别:

ES6 模块的设计思想是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS 和 AMD 模块,都只能在运行时确定这些东西。

模块化统一:

Vue中 export default 和 export 区别的更多相关文章

  1. ES6中export default与export的区别

    1.export default 和export都可以用于导出常量,函数,文件,模块等: 2.可以在模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使 ...

  2. export ,export default 和 import 区别 以及用法

    首先要知道export,import ,export default是什么 ES6模块主要有两个功能:export和importexport用于对外输出本模块(一个文件可以理解为一个模块)变量的接口i ...

  3. ES6:export default 和 export 区别

    export default 和 export 区别: 1.export与export default均可用于导出常量.函数.文件.模块等 2.你可以在其它文件或模块中通过import+(常量 | 函 ...

  4. ES6 export default 和 export 的区别

    export default 和 export 区别: 1.export与export default均可用于导出常量.函数.文件.模块等 2.你可以在其它文件或模块中通过import+(常量 | 函 ...

  5. export ,export default 和 import 区别以及用法

    首先要知道export,import ,export default是什么 ES6模块主要有两个功能:export和importexport用于对外输出本模块(一个文件可以理解为一个模块)变量的接口i ...

  6. export default与export的区别

    1.export default 和export都可以用于导出常量,函数,文件,模块等: 2.可以在模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使 ...

  7. module.exports,exports和export default,export的区别

    前提:CommonJS模块规范和ES6模块规范是完全不同的两个概念. module.exports,exports属于CommonJS模块规范: export default,export属于ES6模 ...

  8. export default 和 export的使用方式

    注意:1.export default 向外暴露的成员,可以使用任意的变量来接收 2.在一个模块中 ; export default 只允许向外暴露一次 3.在一个模块中 ; 可以同时使用 expor ...

  9. export default 和 export 的使用方式(六)

    一:ES6 的导入模块方式和暴露对象方式: ES6 中导入模块使用:import 模块名称 from '模块标识符':import '表示路径': 在 ES6 中使用 export default 和 ...

  10. export default和export的使用

    export default和export都是用来向外暴露成员 export default 向外暴露的成员可以使用任意的变量来接收,在一个模块中,export default只允许向外暴露一次,可以 ...

随机推荐

  1. Mysql系列二:Mysql 开发标准规范

    原文链接:http://www.cnblogs.com/liulei-LL/p/7729983.html 一.表设计 1. 库名.表名.字段名使用小写字母,“_”分割. 2. 库名.表名.字段名不超过 ...

  2. 奇葩问题 eclipse中DDMS的LOGcat只有一列level

    http://stackoverflow.com/questions/25010393/eclipse-logcat-shows-only-the-first-letter-from-each-mes ...

  3. react 生命周期钩子里不要写逻辑,否则不生效

    react 生命周期钩子里不要写逻辑,否则不生效,要把逻辑写在函数里,然后在钩子里调用函数,否则会出现问题.

  4. [JS] ECMAScript 6 - Destructuring

    C#里没有这种变态的方法. 虽然变态,但看起来不错的样子. 变量的解构赋值 完全解构:本质上,这种写法属于“模式匹配”,: 不完全解构:同时支持“不完全解构” let [x, y] = [1, 2, ...

  5. 由n个元素组成的数组,n-2个数出现了偶数次,两个数出现了奇数次,且这两个数不相等,如何用O(1)的空间复杂度,找出这两个数

    思路分析: 方法一:涉及到两个数,就要用到异或定理了:若a^b=x,则a=b^x,b=x^a.对于这道题,假设这两个数分别为a.b,将数组中所有元素异或之后结果为x,因为a!=b,所以x=a^b,且x ...

  6. SpringBoot自定义错误信息,SpringBoot适配Ajax请求

    SpringBoot自定义错误信息,SpringBoot自定义异常处理类, SpringBoot异常结果处理适配页面及Ajax请求, SpringBoot适配Ajax请求 ============== ...

  7. 一篇文章带你看懂Cloudflare信息泄露事件

    版权声明:本文由贺嘉  原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/753847001488039974 来源:腾云阁  ...

  8. ansj分词原理

    ansj第一步会进行原子切分和全切分,并且是在同时进行的.所谓原子,是指短句中不可分割的最小语素单位.例如,一个汉字就是一个原子.全切分,就是把一句话中的所有词都找出来,只要是字典中有的就找出来.例如 ...

  9. 移动端H5混合开发设置复盘与总结

    此篇接上一篇: 移动端H5混合开发,Touch触控,拖拽,长按, 滑屏 实现方案 https://www.cnblogs.com/buoge/p/9346699.html app 场布设置已经上线了, ...

  10. <target>.ID 和 <source>.ID 的属性冲突: DataType 属性不匹配

    ORACLE数据库主键的数据类型为number ,如果不指定长度会有 Merge报 <target>.ID 和 <source>.ID 的属性冲突: DataType 属性不匹 ...