ホームページ > ウェブフロントエンド > jsチュートリアル > TypeScript に関するヒントを共有する

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

零下一度
リリース: 2018-05-17 14:16:21
オリジナル
2612 人が閲覧しました

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 サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート