目錄

• 1.定義和使用
• 1.1定義
  
• 1.2使用
  
• 2.拆分為多個檔案
• 3.別名

前言：

名稱空間namespace在TypeScript1.5版本之前是叫做內部模組 ，那是因為ES6中的模組還沒有稱為正式標準，在ES6提出該規範時，TypeScript1.5 正事更名為名稱空間 ，用namespace來定義。

1.定義和使用

1.1定義

名稱空間的定義就相當於定義了一個物件，該物件中可以定義變數、介面、類、方法等等，但是如KlhRaz果不使用export關鍵字指定此內容為外部可見的話，外部是沒有辦法訪問到的。

接下來定義一個正則驗證的一個.ts檔案，實現程式碼如下：

// validation.ts
// 通過 namespace 建立一個名為 Validation 的名稱空間
namespace Validation {
    // 定義一個正則表示式
    const isLetterReg = /^[A-Za-z]+$/
    // 這裡在定義一個正則表示式，與上一個的區別就是這個正則表示式通過export匯出了
    export const isNumberReg = /^[0-9]+$/
    // 匯出一個方法
    export const checkLetter = (text: any) => {
        return isLetterReg.test(text)
    }
}

在上面的程式碼中，我們定義了一個名為Validation的名稱空間，並在裡面定義了兩個屬性和一個方法，並將一個屬性和一個方法匯出(名稱空間的中匯出使用export關鍵字)。

1.2使用

在某個檔案使用名稱空間中的內容只需要在使用外部名稱空間的地方使用/// <reference path=“namespace.ts”/>來引入，注意三斜線///開頭，然後在 path 屬性指定相對於當前檔案，這個名稱空間檔案的路徑。具體程式碼如下：

// index.ts
/// <reference  path='validation.ts' />
let isLetter = Validation.checkLetter('text')
const reg = Validation.isNumberReg
console.log(isLetter)
console.log(reg)

值得注意的是第一行的/// <reference path='validation.ts' /> 。語法結構是不能錯的，否則編譯是不通過的。

編譯命令如下：

tsc --outFile src/index. index.ts

outFile引數是用於將輸出檔案合併為一個檔案

編譯後的index.js檔案如下：

// 通過 namespace 建立一個名為 Validation 的名稱空間
var Validation;
(function (Validation) {
    // 定義一個正則表示式
    var isLetterReg = /^[A-Za-z]+$/;
    // 這裡在定義一個正則表示式，與上一個的區別就是這個正則表示式通過export匯出了
    Validation.isNumberReg = /^[0-9]+$/;
    // 匯出一個方法
    Validation.checkLetter = function (text) {
        return isLetterReg.test(text);
    };
})(Validation || (Validation = {}));
/// <reference  path='validation.ts' />
var isLetter = Validation.checkLetter('text');
var reg = Validation.isNumberReg;
console.log(isLetter);
console.log(reg);

2.拆分為多個檔案

隨著我們的開發內容的不斷增加，我們可以將同一個命名名稱空間拆分為多個檔案分開維護，儘管我們將其拆分為為多個檔案，但是他們仍然屬於一個名稱空間，

示例程式碼如下：

LetterValidation.ts

// LetterValidation.ts
namespace Validation {
    export const isLetterReg = /^[A-Za-z]+$/
    export const checkLetter KlhRaz= (text: any) => {
        return isLetterReg.test(text)
    }
}

NumberValidation.ts

// NumberValidation.ts
namespace Validation {
    export const isNumberReg = /^[0-9]+$/
    export const checkNumber = (text: any) => {
        return isNumberReg.test(text)
    }
}

index.ts

// index.ts
/// <reference path="./LetterValidation.ts"/>
/// <reference path="./NumberValidation.ts"/>
let isLetter = Validation.checkLetter('text')
const reg = Validation.isNumberReg
console.log(isLetter)

我們使用命令列來編譯一下：

tsc --outFile src/index.js index.ts

最終編譯後的index.js程式碼如下：

// LetterValidation.ts
var Validation;
(function (Validation) {
    Validation.isLetterReg = /^[A-Za-z]+$/;
    Validation.checkLetter = function (text) {
        return Validation.isLetterReg.test(text);
    };
})(Validation || (Validation = {}));
// NumberValidation.ts
var Validation;
(function (Validation) {
    Validation.isNumberReg = /^[0-9]+$/;
    Validation.checkNumber = function (text) {
        return Validation.isNumberReg.test(text);
    };
})(Validation || (Validation = {}));
/// <reference path="./LetterValidation.ts"/>
/// <reference path="./NumberValidation.ts"/>
var isLetter = Validation.checkLetter('text');
var reg = Validation.isNumberReg;
console.log(isLetter);

由編譯結果可以看出，我們先引入了LetterValidation.ts檔案，後引入NumberValidation.ts檔案，他們最終編譯後的結果也是按照引入順序編譯的。

3.別名

別名是一種簡化名稱空間的操作方式，其語法是使用import關鍵字，使用方式如下：

import q = x.y.z

值得注意的是該方式不要與家長模組的import x = require('name')語法混淆，這裡的語法是為指定的符號建立一個別名。可以使用該方法為任意識別符號建立別名，也包括引入模組中的物件。

// 定義一個名稱空間
namespace Shapes {
    // 在名稱空間中定義一個子名稱空間，並將其匯出
    export namespace Polygons {
        export class Triangle {}
        export class Square {}
    }
}
// 通過 import 的語法將匯出的子名稱空間重新命名為 polygons
import polyghttp://www.cppcns.comons KlhRaz= Shapes.Polygons
// 通過匯出的名稱空間例項化 Square 類
let sq = new polygons.Square()

通過這個例子我們可以看到，使用import關鍵字來定義名稱空間中某個輸出元素的別名，可以減少我們深層次獲取屬性的成本。

到此這篇關於TypeScript名稱空間講解的文章就介紹到這了,更多相關TypeScript名稱空間內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！