js-ES6學習筆記-module（3）

1、如果想設置跨模塊的常量（即跨多個文件），或者說一個值要被多個模塊共享，可以采用下面的寫法。

// constants.js 模塊
export const A = 1;
export const B = 3;
export const C = 4;

// test1.js 模塊
import * as constants from './constants';
console.log(constants.A); // 1
console.log(constants.B); // 3

// test2.js 模塊
import {A, B} from './constants';
console.log(A); // 1
console.log(B); // 3

2、如果要使用的常量非常多，可以建一個專門的constants目錄，將各種常量寫在不同的文件里面，保存在該目錄下。

// constants/db.js
export const db = {
  url: 'http://my.couchdbserver.local:5984',
  admin_username: 'admin',
  admin_password: 'admin password'
};

// constants/user.js
export const users = ['root', 'admin', 'staff', 'ceo', 'chief', 'moderator'];

然后，將這些文件輸出的常量，合並在index.js里面。

// constants/index.js
export {db} from './db';
export {users} from './users';

使用的時候，直接加載index.js就可以了。

// script.js
import {db, users} from './constants';

3、import和export命令只能在模塊的頂層，不能在代碼塊之中（比如，在if代碼塊之中，或在函數之中）。

這樣的設計，固然有利於編譯器提高效率，但也導致無法在運行時加載模塊。從語法上，條件加載就不可能實現。如果import命令要取代 Node 的require方法，這就形成了一個障礙。因為require是運行時加載模塊，import命令無法取代require的動態加載功能。

因此，有一個提案，建議引入import()函數，完成動態加載。

import()類似於 Node 的require方法，區別主要是前者是異步加載，后者是同步加載。

4、下面是import()的一些適用場合。

（1）按需加載。

import()可以在需要的時候，再加載某個模塊。

（2）條件加載

import()可以放在if代碼塊，根據不同的情況，加載不同的模塊。

（3）動態的模塊路徑

import()允許模塊路徑動態生成。

5、import()加載模塊成功以后，這個模塊會作為一個對象，當作then方法的參數。因此，可以使用對象解構賦值的語法，獲取輸出接口。

import('./myModule.js')
.then(({export1, export2}) => {
  // ...·
});