TypeScript に関するヒントを共有する-jsチュートリアル-php.cn

TypeScript に関するヒントを共有する

零下一度

リリース： 2018-05-17 14:16:21

オリジナル

2653 人が閲覧しました

C++ プロジェクトで TypeScript (以下、ts) をコンパイルします

ts ファイルのプロパティを編集し、項目タイプとして「カスタムプロダクションツール」を選択します。

コマンドラインでtscの場所とコンパイルパラメータを入力します。私の場合は、「C:Program Files (x86)Microsoft SDKsTypeScript2.2tsc」%(Identity) --outFile %(RelativeDir)/%(FileName).js -tです。エス5。スペースを含む UNC (Universal Naming Convention) は二重引用符で囲む必要があります。 %(Identity) は、コンパイルされたファイルの場所です。

--outFile は出力パラメータで、その後に出力場所が続きます。

-t (--target) はターゲットのタイプです。私は ES5 を使用しています。"ES3" (デフォルト)、"ES5"、"ES6" にすることもできます。 code> /<code>"ES2015"、"ES2016"、"ES2017"、または "ESNext"。 "ES5", "ES6"/"ES2015", "ES2016", "ES2017" or "ESNext"。

　　说明写%(Identity)就可以，这个随意。

%(Identity)とだけ書きます。これはオプションです。

出力は$(FileName).jsとして記述されます。これはコンパイルの必要性を判断するために使用されます。

追記：これは私が調べた方法ですが、もっと標準的な方法があるような気がします。公式は C++ プロジェクトでコンパイルする方法を紹介していませんでした。

ts の jquery のステートメントを引用

jquery は ts で書かれていないため、ts ファイルは git 上に見つかりません。幸いなことに、vs は、js を含むあらゆるプロジェクトタイプに対して新しい html ファイルを作成します。ファイルのバージョンが jquery の場合、スマートプロンプトは自動的に $ をサポートします。次に、マウスを $ の左または右に置き、F12 を押して定義を表示します。ラベルを右クリックして「ディレクトリを開く」を選択し、ファイルを見つけてコピーします。独自のプロジェクトディレクトリにコピーします。

現在の ts ファイルを参照するには、トリプルスラッシュ構文を使用します ///

.d.ts ファイルは宣言ファイルであり、論理コードは含まれていません。構造。

独自のtsファイルの宣言ファイルを生成する方法

前と同様に、tscコンパイラは宣言ファイルを生成でき、パラメータ-d/--declarationとtsファイルのみが必要です。

例: tsc -d main.ts

コマンドラインを使用してtsファイルをコンパイルしますか？

はい、ご面倒でなければ大丈夫です。 VS の VS 2017 の開発者コマンドプロンプトでは、tsc コマンドを直接使用できます。スタート画面に固定すると、起動効率が向上します。

宣言が取得できない問題の解決方法

　　declare var swal: (arg: any) => any;

ログイン後にコピー

ts宣言を提供しないswalのような関数があるので自由に使えることを追記します。もちろん、これはパラメータの誤用です。

tsのHTMLElement.removeメンバーは存在せず、その親オブジェクトのremoveChildしか使えず、あまり便利ではありません。

dom:HTMLElement;

　　(<any>dom).remove();// 就这样勉强的转为any再调用remove吧。

ログイン後にコピー

オブジェクトごとにクラスを作成する必要はありません

tsクラスはクラスの内部宣言をサポートしていません。したがって、クラスの外でメンバー型を宣言することは適切ではありません。

　　class foo{
　　　　member:{mem1:number, mem2?:string};// 加问号表示可有可无　　}

ログイン後にコピー

このように、member は内部クラスに似ています。

Event subscription and thisparameter

　　class bar{
　　　　sub(){
　　　　　　dom.onclick=function(){this};
　　　　}
　　}

ログイン後にコピー

このように、関数 function の this が dom オブジェクトになります。

dom.onclick=()=>{this};

これ this はクラス bar のインスタンスを表します。

それではオブジェクトdomとbarのインスタンスが欲しいのですが？

現時点ではクロージャのみを使用できます:

　　class bar{
　　　　click(node:HTMLElement, ev:MouseEvent){
　　　　　　this...
　　　　}
　　　　dom.onclick = (ev:MouseEvent)=>this.click(dom,ev);
　　}

ログイン後にコピー

結局のところ、dom はクロージャで渡されます。結局のところ、click は bar のメンバー関数です。

Readonly プロパティには readonly は必要ありません

変更したい場合、readonly はクラスの内部アクセスに不便です

そのため、Object.defineProperty を使用する必要があります。ts にはより便利な set/get 操作プロパティがあります。

　　class baz{
　　　　_attr:[];
　　　　get attr(){
　　　　　　return _attr;
　　　　}
　　}

ログイン後にコピー

こうするとattrは読み取れるだけになります。属性機能を使用するには、ts コンパイラのターゲットオプション (-t/--target) を es5 以降に設定する必要があります。

この記事は ts スキルに関連するものであれば更新し続けます。もしあなたがこの記事をフォロー/お気に入りに登録してください。

ところで: cnblogs は ts コードのカラーリングをサポートしておらず、JS コードのカラーリングを使用します。 🎜

以上がTypeScript に関するヒントを共有するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。