TypeScript 模組
TypeScript 模組的設計理念是可以更換的組織程式碼。
模組是在其自身的作用域裡執行，並不是在全域性作用域，這意味著定義在模組裡面的變數、函式和類等在模組外部是不可見的，除非明確地使用 export 匯出它們。類似地，我們必須通過 import 匯入其他模組匯出的變數、函式、類等。
兩個模組之間的關係是通過在檔案級別上使用 import 和 export 建立的。
模組使用模組載入器去匯入其它的模組。 在執行時，模組載入器的作用是在執行此模組程式碼前去查詢並執行這個模組的所有依賴。 大家最熟知的JavaScript模組載入器是服務於 Node.js 的 CommonJS 和服務於 Web 應用的 Require.js。
此外還有有 SystemJs 和 Webpack。
模組匯出使用關鍵字 export 關鍵字，語法格式如下：
// 檔名 : SomeInterface.ts
export interface SomeInterface {
// 程式碼部分
}
要在另外一個檔案使用該模組就需要使用 import 關鍵字來匯入:
import someInterfaceRef = require("./SomeInterface");
例項
IShape.ts 檔案程式碼：
/// <reference path = "IShape.ts" />
export interface IShape {
draw();
}
Circle.ts 檔案程式碼：
import shape = require("./IShape");
export class Circle implements shape.IShape {
public draw() {
console.log("Cirlce is drawn (external module)");
}
}
Triangle.ts 檔案程式碼：
import shape = require("./IShape");
export class Triangle implements shape.IShape {
public draw() {
console.log("Triangle is drawn (external module)");
}
}
TestShape.ts 檔案程式碼：
import shape = require("./IShape");
import circle = require("./Circle");
import triangle = require("./Triangle");
function drawAllShapes(shapeToDraw: shape.IShape) {
shapeToDraw.draw();
}
drawAllShapes(new circle.Circle());
drawAllShapes(new triangle.Triangle());
使用 tsc 命令編譯以上程式碼（AMD）：
tsc --module amd TestShape.ts
得到以下 JavaScript 程式碼：
IShape.js 檔案程式碼：
define(["require", "exports"], function (require, exports) {
});
Circle.js 檔案程式碼：
define(["require", "exports"], function (require, exports) {
var Circle = (function () {
function Circle() {
}
Circle.prototype.draw = function () {
console.log("Cirlce is drawn (external module)");
};
return Circle;
})();
exports.Circle = Circle;
});
Triangle.js 檔案程式碼：
define(["require", "exports"], function (require, exports) {
var Triangle = (function () {
function Triangle() {
}
Triangle.prototype.draw = function () {
console.log("Triangle is drawn (external module)");
};
return Triangle;
})();
exports.Triangle = Triangle;
});
TestShape.js 檔案程式碼：
define(["require", "exports", "./Circle", "./Triangle"],
function (require, exports, circle, triangle) {
function drawAllShapes(shapeToDraw) {
shapeToDraw.draw();
}
drawAllShapes(new circle.Circle());
drawAllShapes(new triangle.Triangle());
});
使用 tsc 命令編譯以上程式碼（Commonjs）：
tsc --module commonjs TestShape.ts
得到以下 JavaScript 程式碼：
Circle.js 檔案程式碼：
var Circle = (function () {
function Circle() {
}
Circle.prototype.draw = function () {
console.log("Cirlce is drawn");
};
return Circle;
})();
exports.Circle = Circle;
Triangle.js 檔案程式碼：
var Triangle = (function () {
function Triangle() {
}
Triangle.prototype.draw = function () {
console.log("Triangle is drawn (external module)");
};
return Triangle;
})();
exports.Triangle = Triangle;
TestShape.js 檔案程式碼：
var circle = require("./Circle");
var triangle = require("./Triangle");
function drawAllShapes(shapeToDraw) {
shapeToDraw.draw();
}
drawAllShapes(new circle.Circle());
drawAllShapes(new triangle.Triangle());
輸出結果為：
Cirlce is drawn (external module) Triangle is drawn (external module)