ES6中export default 与export区别

 说明

export与export default均可用于导出常量、函数、文件、模块等,有什么区别呢?

export的方式 - 1次导出1个或者多个

//a.js
export const name = "猫宝宝";
export function cat() { }


//b.js
import { name , cat} from 'a'//导入的时候需要花括号

export default的方式 - 1次导出多个

//a.js
const name = "猫宝宝";
function cat() { }

export default {
    name,
    cat
}

//b.js
import custom  from 'a'; //导入的时候没有花括号,custom是自定义的名称,此处custom = {name,cat}
console.info(custom.name)
console.info(custom.cat)

export default的方式 - 1次导出1个

//a.js
const name = "猫宝宝";

export default name


//b.js
import name from 'a' //导入的时候没有花括号

总结

  • 在一个文件或模块中,export、import可以有多个,export default仅有一个
  • 通过export方式导出,在import时导入时需要加{ }
  • 通过export default,在import时导入时不需要加{ }
  • 使用export default命令,为模块指定默认输出,不需要知道加载模块的变量名



//导入的时候没有花括号

原文地址:https://www.cnblogs.com/PeunZhang/p/12850404.html