TypeScript名前空間の説明

TypeScript 1.5 より前では、ES6 のモジュールはまだ正式な標準ではなかったため、 namespace内部モジュールと呼ばれていました。ES6 が仕様を提案したとき、TypeScript 1.5 では正式に名前空間に変更され、 namespaceを使用して定義されました。

1. 定義と使用

1.1 定義

名前空間の定義は、変数、インターフェース、クラス、メソッドなどを定義できるオブジェクトを定義することと同じです。ただし、export キーワードを使用してこのコンテンツが外部から参照可能であることを指定しないと、外部からアクセスすることはできません。

次に、通常の検証用の .ts ファイルを定義します。実装コードは次のとおりです。

// 検証.ts
// namespace namespace Validation { を通じて Validation という名前の名前空間を作成します。
    // 正規表現を定義する const isLetterReg = /^[A-Za-z]+$/
    // ここで正規表現を定義します。前のものとの違いは、この正規表現が export const isNumberReg = /^[0-9]+$/ を通じてエクスポートされることです。
    // メソッドをエクスポートする export const checkLetter = (text: any) => {
        isLetterReg.test(テキスト) を返します
    }
}

上記のコードでは、 Validationという名前空間を定義し、その中に 2 つのプロパティと 1 つのメソッドを定義し、1 つのプロパティと 1 つのメソッドをエクスポートします (名前空間のエクスポートでは export キーワードが使用されます)。

1.2 使用

ファイル内の名前空間のコンテンツを使用するには、外部名前空間が使用されている場所に/// <reference path=“namespace.ts”/>を使用して導入します。先頭の 3 つのスラッシュ /// に注意し、次に path 属性で現在のファイルに対する名前空間ファイルの相対パスを指定します。具体的なコードは次のとおりです。

// インデックス.ts
/// <参照パス='validation.ts' />
isLetter = Validation.checkLetter('text') とします。
const reg = Validation.isNumberReg
console.log(文字です)
コンソール.log(reg)

最初の行の/// <reference path='validation.ts' />に注意してください。文法構造が間違っていてはいけません。間違っているとコンパイルが失敗します。

コンパイルコマンドは次のとおりです。

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

outFileパラメータは出力ファイルを1つのファイルにマージするために使用されます

コンパイルされた index.js ファイルは次のとおりです。

// namespace var Validation を使用して、Validation という名前の名前空間を作成します。
(関数 (検証) {
    // 正規表現を定義します var isLetterReg = /^[A-Za-z]+$/;
    // ここで正規表現を定義します。前のものとの違いは、この正規表現がエクスポートを通じてエクスポートされることです。Validation.isNumberReg = /^[0-9]+$/;
    // メソッドをエクスポートする Validation.checkLetter = function (text) {
        isLetterReg.test(テキスト) を返します。
    };
})(検証 || (検証 = {}));
/// <参照パス='validation.ts' />
var isLetter = Validation.checkLetter('text');
var reg = Validation.isNumberReg;
console.log(文字数);
コンソールにログ出力します。

2. 複数のファイルに分割する

開発内容が増え続けるにつれて、同じ名前空間を複数のファイルに分割して個別にメンテナンスできるようになります。複数のファイルに分割しても、それらは 1 つの名前空間に属します。

サンプルコードは次のとおりです。

文字検証.ts

// 文字検証.ts
名前空間検証 {
    エクスポート const isLetterReg = /^[A-Za-z]+$/
    エクスポート const checkLetter = (テキスト: 任意) => {
        isLetterReg.test(テキスト) を返します
    }
}

数値検証.ts

// 数値検証.ts
名前空間検証 {
    エクスポート const isNumberReg = /^[0-9]+$/
    エクスポート const checkNumber = (テキスト: 任意) => {
        isNumberReg.test(テキスト) を返します。
    }
}

インデックス.ts

// インデックス.ts
/// <参照パス="./LetterValidation.ts"/>
/// <参照パス="./NumberValidation.ts"/>
isLetter = Validation.checkLetter('text') とします。
const reg = Validation.isNumberReg
console.log(文字です)

コマンドラインを使用してコンパイルします。

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

最終的にコンパイルされた index.js コードは次のようになります。

// 文字検証.ts
var 検証;
(関数 (検証) {
    Validation.isLetterReg = /^[A-Za-z]+$/;
    Validation.checkLetter = 関数 (テキスト) {
        Validation.isLetterReg.test(text) を返します。
    };
})(検証 || (検証 = {}));
// 数値検証.ts
var 検証;
(関数 (検証) {
    Validation.isNumberReg = /^[0-9]+$/;
    Validation.checkNumber = 関数 (テキスト) {
        Validation.isNumberReg.test(text) を返します。
    };
})(検証 || (検証 = {}));
/// <参照パス="./LetterValidation.ts"/>
/// <参照パス="./NumberValidation.ts"/>
var isLetter = Validation.checkLetter('text');
var reg = Validation.isNumberReg;
console.log(文字数);

コンパイル結果から、最初にLetterValidation.tsファイルを導入し、次にNumberValidation.tsファイルを導入したことがわかります。最終的なコンパイル結果も、導入した順序でコンパイルされています。

3. エイリアス

エイリアスは、名前空間の操作を簡素化する方法です。構文は、import キーワードを使用することです。使用方法は次のとおりです。

インポートq = xyz

このメソッドは、親モジュールのimport x = require('name')構文と混同しないように注意してください。ここでの構文は、指定されたシンボルのエイリアスを作成します。このメソッドは、モジュールにインポートされたオブジェクトを含む任意の識別子のエイリアスを作成するために使用できます。

// 名前空間を定義する namespace Shapes {
    // 名前空間にサブ名前空間を定義してエクスポートする export namespace Polygons {
        エクスポートクラス Triangle {}
        クラス Square をエクスポートします {}
    }
}
// インポート構文を使用してエクスポートされたサブ名前空間の名前を polygons に変更します
インポートポリゴン = Shapes.Polygons
// エクスポートされた名前空間から Square クラスをインスタンス化します。let sq = new polygons.Square()

この例から、 importキーワードを使用して名前空間内の出力要素のエイリアスを定義すると、より深いレベルで属性を取得するコストを削減できることがわかります。

TypeScript名前空間に関するこの記事はこれで終わりです。TypeScript 名前空間の詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: