資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法學內部模組和外部模組有何區別？
TypeScript 作為 JavaScript 的擴充套件，引入了模組作為有效構建和組織程式碼的一種方式。透過啟用程式碼封裝和可重用性，模組在開發可擴充套件和可維護的應用程式中起著至關重要的作用。TypeScript 支援兩種型別的模組：內部模組（名稱空間）和外部模組（ES 模組）。
在本文中，我們將深入探討 TypeScript 中內部模組和外部模組之間的區別，探索它們的特性以及它們對程式碼組織和專案內程式碼共享的影響。
內部模組
內部模組，也稱為名稱空間，充當單個檔案內的邏輯容器，用於將相關的程式碼元素組合在一起。它們提供了諸如防止命名衝突以及改進組織和封裝等好處。內部模組在 TypeScript 中使用namespace關鍵字定義。
TypeScript 中內部模組的一個示例可能是一個名為math.ts的檔案，其中包含數學運算：
namespace Math {
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
}
透過將相關函式組織在 Math 名稱空間中，我們可以防止命名衝突並增強程式碼的可維護性。內部模組還可以使用 /// <reference path="..." /> 語法拆分為多個檔案，允許開發人員根據功能組織程式碼。
但是，內部模組有一些限制。由於它們的範圍僅限於封閉的檔案或模組，因此它們不像外部模組那樣具有模組化。隨著專案規模的增長，管理內部模組可能會變得具有挑戰性，可能導致程式碼重複或緊密耦合。
外部模組
外部模組，也稱為 ES 模組，允許在單個檔案中進行程式碼封裝，並促進跨不同檔案和專案共享程式碼。它們遵循廣泛採用的模組語法，例如 CommonJS 或 ES6，允許與各種模組系統和打包器互操作。
TypeScript 中外部模組的一個示例可能是一個名為calculator.ts的檔案，它匯出數學運算：
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
在這裡，函式add和subtract被匯出，使它們可供其他檔案或模組訪問。外部模組促進了模組化和解耦的體系結構，其中元件可以獨立開發並在需要時組合在一起。這有利於程式碼重用，並支援建立易於共享和使用的庫和可重用模組。
外部模組在現代 JavaScript 和工具支援中獲得了顯著的普及。TypeScript 本身鼓勵使用外部模組作為構建可擴充套件和可維護應用程式的推薦方法。
示例 1：內部模組
使用以下命令設定 TypeScript 專案：
$ npm i -g typescript $ tsc --init
在這個例子中，我們有一個名為MathUtils的內部模組。它包含兩個函式：add和subtract，它們分別對數字執行加法和減法運算。
MathUtils.ts
export namespace MathUtils {
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
}
在main.ts檔案中，我們使用import語句從mathUtils.ts檔案匯入MathUtils名稱空間。
import { MathUtils } from './mathUtils';
const result1 = MathUtils.add(5, 3);
console.log(`Result of addition: ${result1}`);
const result2 = MathUtils.subtract(10, 4);
console.log(`Result of subtraction: ${result2}`);
然後，我們使用MathUtils名稱空間中的add和subtract函式分別執行加法和減法運算。結果儲存在result1和result2變數中，它們的值使用console.log()顯示。
編譯時執行以下命令：
$ tsc main.ts $ node main.js
輸出
它將產生以下輸出：
Result of addition: 8 Result of subtraction: 6
透過使用內部模組，我們可以將這些相關功能封裝在Catalog名稱空間中，防止與程式碼庫的其他部分發生命名衝突。
示例 2：外部模組
我們將再次使用與示例 1 中相同的方法來設定新的 TypeScript 專案。
現在，讓我們考慮一個外部模組示例，其中我們有兩個單獨的檔案：calculator.ts 和 app.ts。calculator.ts 檔案匯出數學運算，而 app.ts 檔案匯入並使用這些運算。
calculator.ts
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
app.ts
import { add, subtract } from "./calculator";
console.log(`The sum of 3 and 5 is: ${add(5, 3)}`); // Output: 8
console.log(`The difference between 4 and 10 is: ${subtract(10, 4)}`); // Output: 6
在這個例子中，calculator.ts檔案使用export關鍵字匯出add和subtract函式。然後，可以透過指定相對路徑（'./calculator'）在app.ts檔案中匯入和使用這些函式。匯入的函式可以直接呼叫，從而提供模組化和程式碼重用。
輸出
它將產生以下輸出：
The sum of 3 and 5 is: 8 The difference between 4 and 10 is: 6
結論
總之，瞭解 TypeScript 中內部模組和外部模組的區別對於有效組織程式碼至關重要。內部模組提供了更好的組織性，並防止了檔案或模組內的命名衝突。但是，在大型專案中，它們可能會變得難以管理。外部模組提供了一種更模組化和可共享的方法，增強了可重用性和協作性。對於大多數專案而言，外部模組是首選，因為它們提供了靈活性和可擴充套件性。透過利用模組，TypeScript 開發人員可以改進程式碼組織、促進可重用性並構建強大的應用程式。
瀏覽量：251
