JavaScript是一個動態腳本語言，它被廣泛應用于Web開發，在開發初期，我們經常需要導入其他的模塊來幫助我們進行開發，而在現在的ES6標準里，Javascript引入了對模塊化的支持，開發人員可以更方便的管理代碼復用、維護性和可讀性，下面我們就詳細的介紹一下Javascript導入模塊的相關知識。

導入一個模塊在我們的代碼中也稱之為依賴項，當我們需要使用一個外部模塊時，通過import語句來引入其他模塊的exports對象，如下所示：

import { func } from './module.js';

在這里我們使用ES6的模塊化標準引進了一個名為func的變量，同時指定它的來源是當前目錄下的module.js文件。

同時我們也可以導入模塊的全部內容，而不僅僅是指定的內容，下面代碼表示示例模塊中所有導出的內容都會被導入到這個js文件中。

import * as myModule from './module.js';

導入模塊后我們也可以使用as語句來重命名導入的內容名稱，讓它適配我們代碼中的命名方式，如下所示：

import { awesomeMethod as myAwesomeMethod } from './module.js';

使用as除了在導入語句中使用，我們也可以在使用模塊中導出對象時賦予別名：

export { someMethod as myAwesomeMethod };

在使用assemblyscript模塊時，我們還可以把從C++中導入的定義轉化為一個AssemblyScript中熟悉的對象，應用type封裝起來。比如我們有如下的C++函數例子：

namespace example {
int add(int a, int b) {
return a + b;
}
}

我們把它轉化為下面似乎是AssemblyScript類型的對象：

export type AdderType = (a: i32, b: i32) =>i32;
export function EXAMPLE_add(x: i32, y: i32): i32 {
const adder: AdderType = loadAdder();
return adder(x, y);
}
function loadAdder(): AdderType {
const adder: any = Module.cwrap("example_add", "number", ["number", "number"])
return (_x: i32, _y: i32) =>{
return adder(_x, _y);
};
}
Module["add"] = EXAMPLE_add;

總結

Javascript模塊化解決了Javascript開發中大規模復雜代碼管理難題，同時讓代碼具有可讀性且易于維護。通過Javascript導入模塊，我們可以更方便的獲取、封裝和維護Javascript代碼。在ES6語言標準之后，Javascript進一步擁有了全新的模塊系統，并且在一些高級用例中被廣泛應用，例如運營時間長、人力成本和維護成本大的現代Web App。