ES6的模塊暴露與模塊引入

ES6的模塊暴露和引入可以讓我們實現模塊化編程，以下列出ES6的幾種模塊暴露與引入的方式與區別。

1、ES6一共有三種模塊暴露方法

• 多行暴露

模塊1：module1.js

//多行暴露
export function foo() {
    console,console.log('foo() moudle1');
}

export function bar() {
    console.log('bar() moudle1')
}

• 統一暴露

模塊2： module2.js

function fun1() {
    console.log('fun1() module2')
}

function fun2() {
    console.log('fun2() module2')
}
// 統一暴露
export {foo,bar}

以上兩種向外暴露方式在主文件引入時必須使用對象的解構賦值引用（不能使用變量接收的方式來映入）
主模塊：main.js

import {foo,bar} from '.js/src/module1.js'
import {fun1,fun2} from './js/src/module2.js'

• 默認暴露

export default {
    foo() {
        console.log('默認暴露方式')
    },
    bar() {
        console.log('默認暴露')
    }
}

默認暴露的方式只允許有一個: export default {}且在主模塊引入時可以使用定義變量來接收的方式！

// 引入模塊3
import module3 from '.js/src/module3.js'

// 使用模塊
module3.foo()
module3.bar()