ES6子產品化基礎

1、node.js中的子產品化

node.js中遵循了CommonJS的子產品化規範。其中：

導入其它子產品使用require()方法

子產品化對外分享成員使用module.exports對象

子產品化的好處：降低了溝通的成本，極大的友善了各個子產品之間的互相調用，利人利己。

2、前端子產品化規範的分類

在 ES6 子產品化規範誕生之前，JavaScript 社群已經嘗試并提出了 AMD、CMD、CommonJS 等子產品化規範。

但是，這些由社群提出的子產品化标準，還是存在一定的差異性與局限性、并不是浏覽器與伺服器通用的子產品化标準，例如：

AMD 和 CMD 适用于浏覽器端的 Javascript 子產品化

CommonJS 适用于伺服器端的 Javascript 子產品化

太多的子產品化規範給開發者增加了學習的難度與開發的成本。是以，大一統的 ES6 子產品化規範誕生了

3、ES6子產品化規範

ES6子產品化規範是浏覽器與服務端通用的子產品化開發規範。

ES6 子產品化規範中定義：

每個 js 檔案都是一個獨立的子產品

導入其它子產品成員使用 import 關鍵字

向外共享子產品成員使用 export 關鍵字

4、ES6子產品化的基本文法

1、預設導出與預設導入

2、按需導出與按需導入

3、直接導入并執行子產品中的代碼

4.1、預設導出

基本文法：export default 預設導出的成員

let n1=10

let n2=20

function show(){}

export default{

n1, //向外共享n1和show兩個成員

show()

}

4.2、預設導入

基本文法：import 接受名稱 from '子產品辨別符'

//從01_m1.js子產品中導入 export default 向外共享的成員

import m1 from './01_m1.js'

//列印輸出的結果為：n1:10, show:[function:show]

console.log(m1)

預設導出和預設導入的注意事項：

每個子產品中，隻允許使用唯一的一次 export default，否則會報錯

預設導入時的接收名稱可以任意名稱，隻要是合法的成員名稱即可

4.3、按需導出

按需導出的文法： export 按需導出的成員

export let s1='aaa'

export let s2='bbb'

export function say(){}

4.4、按需導入

按需導入的文法： import { s1 } from '子產品辨別符

import {s1,s2,say} from '03_m2.js'

console.log(s1)

console.log(s2)

console.log(say)

按需導出與按需導入的注意事項:

每個子產品中可以使用多次按需導出

按需導入的成員名稱必須和按需導出的名稱保持一緻

按需導入時，可以使用 as 關鍵字進行重命名

按需導入可以和預設導入一起使用

4.5、直接導入并執行子產品中的代碼

如果隻是單純的的執行某個子產品中的代碼，并不需要得到子產品中向外共享的成員，此時，可以直接導入并執行子產品代碼

//直接導入

import './03_m3.js'