序文: TypeScript 1.5 より前では、ES6 のモジュールはまだ正式な標準ではなかったため、 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(テキスト) を返します } } 上記のコードでは、 1.2 使用ファイル内の名前空間のコンテンツを使用するには、外部名前空間が使用されている場所に // インデックス.ts /// <参照パス='validation.ts' /> isLetter = Validation.checkLetter('text') とします。 const reg = Validation.isNumberReg console.log(文字です) コンソール.log(reg) 最初の行の コンパイルコマンドは次のとおりです。 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(文字数); コンパイル結果から、最初に 3. エイリアスエイリアスは、名前空間の操作を簡素化する方法です。構文は、import キーワードを使用することです。使用方法は次のとおりです。 インポートq = xyz このメソッドは、親モジュールの // 名前空間を定義する namespace Shapes { // 名前空間にサブ名前空間を定義してエクスポートする export namespace Polygons { エクスポートクラス Triangle {} クラス Square をエクスポートします {} } } // インポート構文を使用してエクスポートされたサブ名前空間の名前を polygons に変更します インポートポリゴン = Shapes.Polygons // エクスポートされた名前空間から Square クラスをインスタンス化します。let sq = new polygons.Square() この例から、 以下もご興味があるかもしれません:
|
<<: IE6 で JS エラーが発生し、CSS が適用されない HTML エンコードの問題の解決策
>>: CSS3 のディスプレイのグリッドレイアウトとフレックスレイアウトの詳細な説明
序文今日、オープンソース プロジェクトのフィードバック フォームを設計していたところ、絵文字表現を挿...
Web ページ上の色の表現は、さまざまな要因によって影響を受けます。Web ページで非常に美しい配色...
単一のテーブルをエクスポートするmysqldump -u ユーザー -p db名 テーブル名 >...
Ubuntu はソースが中国からなのでダウンロード速度が比較的遅いです。CentOS と異なり、yu...
vue2 プロジェクト開発の経験があれば、$refs に精通しているでしょう。 vue3 の急激なア...
効果(ソースコードは最後にあります): 成し遂げる: 1. タグを定義します。 <h1>...
まずは緑色の無料インストール版のMySQLをダウンロードします。任意のフォルダに入れて構いません。今...
1.VirtualBoxソフトウェアをダウンロードしてインストールするまず、VirtualBox の...
序文この記事では主に、curl を介してフォーム送信ログインを実装する方法について説明します。単一の...
VMware ワークステーションの仮想マシンの互換性の問題を解決するにはどうすればよいですか?ノート...
個人的な実装のスクリーンショット:インストール: npm インストール vue-esign --sa...
等高レイアウト同じ親コンテナー内の同じ高さの子要素のレイアウトを指します。等高レイアウトの実装の観点...
次の背景画像を持つ div があるとします。 次の反射効果を作成します。 方法はたくさんありますが、...
1 はじめに PostgreSQL は、非常に充実した機能を備えたフリーソフトウェアのオブジェクトリ...
MySQLにおける静的変数の役割の詳細な説明静的変数の使用 静的変数サンプルコード: 関数テスト()...