ES6模块化之export和import的用法

//------ lib.js ------const sqrt = Math.sqrt;function square(x) {    return x * x;}function diag(x, y) {    return sqrt(square(x) + square(y));}export {sqrt, square, diag}//------ main.js ------import { square, diag } from 'lib';				console.log(square(11)); // 121console.log(diag(4, 3)); // 5

把export直接加到声明前面就可以省略{} 

//------ lib.js ------export const sqrt = Math.sqrt;export function square(x) {    return x * x;}export function diag(x, y) {    return sqrt(square(x) + square(y));}//------ main.js ------import { square, diag } from 'lib';				console.log(square(11)); // 121console.log(diag(4, 3)); // 5

无论怎样导出，引入的时候都需要{}。

别名引入（Aliasing named imports）

当从不同模块引入的变量名相同的时候

import {speak} from './cow.js'import {speak} from './goat.js'	

这些写法显然会造成混乱

正确的方法是这样的

import {speak as cowSpeak} from './cow.js'import {speak as goatSpeak} from './goat.js'

import {  speak as cowSpeak,  eat as cowEat,  drink as cowDrink} from './cow.js'import {  speak as goatSpeak,  eat as goatEat,  drink as goatDrink} from './goat.js'cowSpeak() // moocowEat() // cow eatsgoatSpeak() // baagoatDrink() // goat drinks

解决方案就是命名空间引入了

命名空间引入（Namespace imports）

import * as cow from './cow.js'import * as goat from './goat.js'cow.speak() // moogoat.speak() // baa

十分的简洁优雅

默认导出（Default exports）

默认导出就不需要name了，但是一个js文件中只能有一个export default。

//------ myFunc.js ------export default function () { ... };//------ main1.js ------import myFunc from 'myFunc';myFunc();

其实这种导出方式可以看成是命名到处的变种，只不过把命名写成了default。

虽然export default只能有一个，但也可以导出多个方法。

export default {  speak () {    return 'moo'  },  eat () {    return 'cow eats'  },  drink () {    return 'cow drinks'  }}

import cow from './default-cow.js'import goat from './default-goat.js'cow.speak() // moogoat.speak() // baa

如果我们在编写模块的时候使用的导出方法不统一，那么引入的时候就需要考虑不同模块引入的方式。这种麻烦可以通过自引用的方法消除。方法如下

编写两种引入方式通用的模块

import * as myself from './ambidextrous-cow.js' // import this file into itself// this module's own namespace is its default exportexport default myselfexport function speak () {  console.log('moo')}

import cow from './ambidextrous-cow'import * as alsocow from './ambidextrous-cow'cow.speak() // mooalsocow.speak() // moo

import * as myself from './ambidextrous-cow.js' export default Object.assign(speak, myself) export function speak () {  console.log('moo')}

import cow from './ambidextrous-cow'import * as alsocow from './ambidextrous-cow'cow() // moocow.speak() // mooalsocow.speak() // moo