ES6 export

1、默認導出（default export）
// 1.一個模塊只能有一個默認導出， 對於默認導出， 導入的名稱能夠和導出的名稱不一致， 這對於導出匿名函數或類很是有用。

<!---- page.js ---->
export default function () {
	return '默認導出'
}
export function setName() {
	return name + 'Tao'
}

<!---- main.js ---->
// 只導出默認的導出
import myFunc from '@/assets/page.js'

// 混合的導出, 默認的導出和其餘的導出
import defaultModel, { setName } from '@/assets/js/page'

// 或者導出全部
import * as page from '@/assets/js/page'

 

2、名字導出（name export）
// 1.名字導出能夠在模塊中導出多個聲明

<!---- page.js ---->
export const name = 'Alan'
export function setName() {
	return name + 'Tao'
}
export function getName() {
	return name
}
// 2.也能夠直接導出一個列表
function setName2() {
	return name + 'Tao2'
}
function getName2() {
	return name
}
export { setName2, getName2 }

<!---- main.js ---->
// import 根據變量名稱導入
import { setName , getName} from '@/assets/js/page'

// import 導入整個模塊
import * as page from '@/assets/js/page'
console.log(page.getName())  // Alan
console.log(page.setName())  // Alan Tao

 

三.解決導出命名衝突的問題，重命名的方法解決方法

// 這兩個模塊都會導出以`flip`命名的東西。
// 要同時導入二者，咱們至少要將其中一個的名稱改掉。
import {flip as flipOmelet} from "one.js"
import {flip as flipHouse} from "two.js"