export、export default 和 import 用法和区别

ES6模块主要有两个功能：export和import

export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口
import用于在一个模块中加载另一个含有export接口的模块。
也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）。这几个都是ES6的语法

语法一

/*a1.js*/
export default {		//向外暴露一个对象
	name: 'tom'
}

/*main.js*/
import a1 from './a1.js'
console.log(a1.name)		//输出 tom

用 export default 在一个模块中只能暴露一次，可以用import 任意变量接收

语法二

/*a1.js*/
export let name = 'tom'
export let age = 23
export let sex = 'male'

/*main.js*/
import { name, sex as xingBie } from './a1.js'
console.log(name)		//输出 tom
console.log(xingBie)	//输出 male

用 export 暴露可以暴露多次，一定要用 import { 原变量名 } 按需接收
使用export导出的成员，如果想 换个变量名 称接收，可以使用 as 来起别名

语法三

/*a1.js*/
let info = {
	name: 'chou',
	age: 24
}
export default info
export let title = 'hello world'
export let content = 'nothing'

/*main.js*/
import person, { title, content as content2 } from './a1.js'
console.log(person)
console.log(title + '---' + content2)

export 和 export default 可以同时使用