07-ts-模塊

這是我參與更文挑戰的第8天，活動詳情查看： 更文挑戰

---

模塊

TypeScript與ECMAScript 2015同樣，任何包含頂級import或者export的文件都被當成一個模塊。相反地，若是一個文件不帶有頂級的import或者export聲明，那麼它的內容被視爲全局可見的（所以對模塊也是可見的）。

導出

導出聲明

任何聲明（好比變量，函數，類，類型別名或接口）都可以經過添加export關鍵字來導出。

export interface Person {
    name: string
    age: number
}

export interface StringValidator {
    isAcceptable(s: string): boolean;
}

export class ZipCodeValidator implements StringValidator {
    isAcceptable(s: string) {
        return s.length === 5 && numberRegexp.test(s);
    }
}

複製代碼

導出語句

導出語句很便利，由於咱們可能須要對導出的部分重命名，因此上面的例子能夠這樣改寫：

class ZipCodeValidator implements StringValidator {
    isAcceptable(s: string) {
        return s.length === 5 && numberRegexp.test(s);
    }
}
export { ZipCodeValidator };
export { ZipCodeValidator as mainValidator };
複製代碼

或者一個模塊能夠包裹多個模塊，並把他們導出的內容聯合在一塊兒經過語法：export * from "module"。

export * from "./StringValidator"; // exports interface StringValidator
export * from "./LettersOnlyValidator"; // exports class LettersOnlyValidator
export * from "./ZipCodeValidator";  
複製代碼

導入

import { ZipCodeValidator } from "./ZipCodeValidator";

const myValidator = new ZipCodeValidator()
複製代碼

也能夠對導入內容重命名

import { ZipCodeValidator as ZCV } from "./ZipCodeValidator";
let myValidator = new ZCV();
複製代碼

將整個模塊導入到一個變量，並經過它來訪問模塊的導出部分

import * as validator from "./ZipCodeValidator";
let myValidator = new validator.ZipCodeValidator();
複製代碼

默認導出

export default class Person {...}
複製代碼

import Person from "./Person.ts"
複製代碼

export = 和 import = require()

CommonJS和AMD的環境裏都有一個exports變量，這個變量包含了一個模塊的全部導出內容。

CommonJS和AMD的exports均可以被賦值爲一個對象, 這種狀況下其做用就相似於 es6 語法裏的默認導出，即 export default語法了。雖然做用類似，可是 export default 語法並不能兼容CommonJS和AMD的exports。

爲了支持CommonJS和AMD的exports, TypeScript提供了export =語法。

若使用export =導出一個模塊，則必須使用TypeScript的特定語法import module = require("module")來導入此模塊。

ZipCodeValidator.ts
let numberRegexp = /^[0-9]+$/;
class ZipCodeValidator {
    isAcceptable(s: string) {
        return s.length === 5 && numberRegexp.test(s);
    }
}
export = ZipCodeValidator;
複製代碼

Test.ts
import zip = require("./ZipCodeValidator");

// Some samples to try
let strings = ["Hello", "98052", "101"];

// Validators to use
let validator = new zip();

// Show whether each string passed each validator
strings.forEach(s => {
  console.log(`"${ s }" - ${ validator.isAcceptable(s) ? "matches" : "does not match" }`);
});

複製代碼

外部模塊簡寫

假如你不想在使用一個新模塊以前花時間去編寫聲明，你能夠採用聲明的簡寫形式以便可以快速使用它。

declarations.d.ts
declare module "hot-new-module";
簡寫模塊裏全部導出的類型將是any。

import x, {y} from "hot-new-module";
x(y);
複製代碼