TypeScript言語とは何ですか?
JavaScriptや利用可能なライブラリができないことは何ができるのでしょうか。それを考える理由になりますか?
TypeScript言語とは何ですか?
JavaScriptや利用可能なライブラリができないことは何ができるのでしょうか。それを考える理由になりますか?
回答:
私が最初にこの回答を書いたのは、TypeScriptがまだ熱狂的な時代でした。5年後、これは問題のない概要ですが、詳細については、以下のLodewijkの回答を参照してください
TypeScriptはJavaScriptのスーパーセットであり、主にオプションの静的型付け、クラス、およびインターフェースを提供します。大きな利点の1つは、コードを入力するときに一般的なエラーを見つけるための豊富な環境をIDEが提供できるようにすることです。
どういう意味か理解するには、Microsoftの言語に関する紹介ビデオをご覧ください。
大規模なJavaScriptプロジェクトの場合、TypeScriptを採用するとソフトウェアがより堅牢になる可能性がありますが、通常のJavaScriptアプリケーションが実行される場所にデプロイできます。
これはオープンソースですが、サポートされているIDEを使用している場合は、入力するときに賢いIntellisenseしか得られません。当初、これはMicrosoftのVisual Studioのみでした(Miguel de Icazaのブログ投稿にも記載されています)。最近では、他のIDEもTypeScriptをサポートしています。
CoffeeScriptがありますが、それは実際には別の目的に役立ちます。IMHO、CoffeeScriptは人間に読みやすさを提供しますが、TypeScriptはオプションの静的型付けを通じてツールにも深い読みやすさを提供します(もう少し批評については、この最近のブログ投稿を参照してください)。Dartもありますが、JavaScriptの完全な置き換えです(ただし、JavaScriptコードを生成できます)。
例として、ここにいくつかのTypeScriptがあります(これはTypeScript Playgroundで遊ぶことができます)
class Greeter {
greeting: string;
constructor (message: string) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
}
}
そして、これが生成するJavaScriptです
var Greeter = (function () {
function Greeter(message) {
this.greeting = message;
}
Greeter.prototype.greet = function () {
return "Hello, " + this.greeting;
};
return Greeter;
})();
TypeScriptがメンバー変数の型とクラスメソッドパラメーターを定義する方法に注意してください。これはJavaScriptへの変換時に削除されますが、数値型をコンストラクターに渡すなどのエラーを見つけるためにIDEおよびコンパイラーによって使用されます。
また、明示的に宣言されていない型を推測することもできgreet()
ます。たとえば、メソッドが文字列を返すと判断します。
多くのブラウザとIDEは、ソースマップを通じて直接デバッグをサポートしています。詳細については、このスタックオーバーフローの質問を参照してください:Visual Studioを使用したTypeScriptコードのデバッグ
私が最初にこの回答を書いたのは、TypeScriptがまだ熱狂的な時代でした。現在の詳細については、この質問に対するLodewijkの回答を確認してください。
-活字体は、プレーンJavaScriptにコンパイルされることはJavaScriptの型付きスーパーセットですtypescriptlang.org。
JavaScriptは、多くの異なる利害関係者で構成される人々のグループであるEMCAの技術委員会39によって開発されたプログラミング言語です。TC39はECMAが主催する委員会です。内部標準組織です。JavaScriptには、さまざまなベンダー(Google、Microsoft、Oracleなど)によるさまざまな実装があります。JavaScriptの目標は、ウェブの共通語になることです。
TypeScriptは、単一のオープンソースコンパイラを備えたJavaScript言語のスーパーセットであり、主に単一のベンダーであるMicrosoftによって開発されています。TypeScriptの目標は、型システムを通じて間違いを早期に発見し、JavaScript開発をより効率的にすることです。
基本的に、TypeScriptは3つの方法でその目標を達成します。
最新のJavaScript機能のサポート -JavaScript言語(ランタイムではない)はECMAScript標準によって標準化されています。すべてのブラウザーとJavaScriptランタイムがすべてのECMAScript標準のすべての機能をサポートしているわけではありません(この概要を参照)。活字体は、最新のECMAScriptの多くの使用を可能にする(のリストを参照いただけますし、あなたが選んだの古いECMAScriptのターゲットにそれらを変換し、コンパイルのターゲットを下--target
コンパイラオプション)。つまり、古いブラウザーやJavaScriptランタイムとの下位互換性を維持しながら、モジュール、ラムダ関数、クラス、スプレッドオペレーター、デストラチャなどの新しい機能を安全に使用できます。
高度な型システム -型のサポートはECMAScript標準の一部ではなく、JavaScriptのコンパイルされた性質ではなく、解釈された性質によるものではない可能性があります。TypeScriptの型システムは信じられないほど豊富で、インターフェース、列挙型、ハイブリッド型、ジェネリック、共用体/交差型、アクセス修飾子などが含まれています。TypeScript の公式Webサイトでは、これらの機能の概要を説明しています。Typescriptの型システムは、他のほとんどの型付き言語と同等であり、場合によってはおそらくより強力です。
開発者ツールのサポート -TypeScriptのコンパイラーはバックグラウンドプロセスとして実行でき、インクリメンタルコンパイルとIDE統合の両方をサポートできるため、ナビゲート、問題の特定、可能性の調査、コードベースのリファクタリングがより簡単になります。
TypeScriptは、JavaScriptにコンパイルされる他の言語と比較して、独自の哲学を持っています。JavaScriptコードは有効なTypeScriptコードです。TypeScriptはJavaScriptのスーパーセットです。.js
ファイルの名前をファイルに変更.ts
してTypeScriptを使い始めることができます(以下の「JavaScriptの相互運用性」を参照)。TypeScriptファイルは読み取り可能なJavaScriptにコンパイルされるため、元に戻す移行が可能であり、コンパイルされたTypeScriptを理解することは難しくありません。TypeScriptはJavaScriptの成功に基づいて構築され、JavaScriptの弱点を改善しています。
一方では、最新のECMAScript標準を採用し、それを古いJavaScriptバージョンにコンパイルして、最も人気のあるBabelを備えた将来性のあるツールがあります。一方、JavaScriptをターゲットとするJavaScriptとは完全に異なる可能性がある言語があります。)。これらの言語は、JavaScriptの未来がこれまでリードする可能性がある場所よりも優れている可能性がありますが、未来を保証するのに十分な採用を見つけられないという大きなリスクを負います。また、これらの言語の一部については、経験豊富な開発者を見つけるのに苦労する場合もありますが、多くの場合、熱心な言語を見つけることができます。JavaScriptとの相互運用は、JavaScriptの実際のものからさらに離れているため、少し複雑になる場合もあります。
TypeScriptはこれら2つの極端な中間に位置し、リスクのバランスをとります。TypeScriptは、どの標準でもリスクのある選択ではありません。JavaScriptは完全に異なる言語ではなく、JavaScriptの相互運用性に優れており、最近多く採用されているため、JavaScriptに慣れていれば慣れるのにほとんど労力を要しません。
JavaScriptは動的に型付けされます。つまり、JavaScriptは、実行時に実際にインスタンス化されるまで、変数のタイプを認識しません。これは、手遅れになる可能性があることも意味します。TypeScriptはJavaScriptに型サポートを追加します。一部の変数が特定のタイプであるという誤った仮定によって引き起こされるバグは、カードを正しくプレイすることで完全に根絶することができます(コードの入力の厳密さ、またはコードの入力の自由度はあなた次第です)。
TypeScriptでは、型推論を使用することにより、タイピングが少し簡単になり、明示性が大幅に低下します。たとえばvar x = "hello"
、TypeScriptでははと同じvar x : string = "hello"
です。タイプはその使用から単純に推測されます。型を明示的に入力しなくても、実行時エラーが発生するようなことを行わないようにするために、型はまだ残っています。
TypeScriptは、オプションでデフォルトで入力されます。たとえばfunction divideByTwo(x) { return x / 2 }
、TypeScriptの有効な関数は、文字列で呼び出すと明らかにランタイムエラーが発生しますが、任意の種類のパラメーターで呼び出すことができます。JavaScriptに慣れているように。これは機能します。divideByTwoの例のように、タイプが明示的に割り当てられておらず、タイプを推測できない場合、TypeScriptはタイプを暗黙的に割り当てます。つまり、divideByTwo関数の型シグネチャは自動的にになります。この動作を禁止するコンパイラフラグがあります。このフラグを有効にすると、安全性が高まりますが、入力する回数が増えることになります。any
function divideByTwo(x : any) : any
--noImplicitAny
タイプにはコストが関連付けられています。まず第一に、学習曲線があり、第二に、もちろん、適切な厳密な型指定を使用してコードベースを設定する場合は、少し時間がかかります。私の経験では、これらのコストは、他の人と共有している深刻なコードベースではまったく価値があります。Githubのプログラミング言語とコード品質に関する大規模な調査では、「静的に型付けされた言語は、一般に動的型よりも欠陥が少なく、同じ点で強い型付けが弱い型よりも優れている」と示唆されています。
この非常に同じ論文では、TypeScriptはJavaScriptよりもエラーが発生しにくいことがわかっています。
正の係数を持つものについては、その言語が、より多くの欠陥修正に関連していると期待できます。これらの言語には、C、C ++、 JavaScript、Objective-C、Php、Pythonが含まれます。Clojure、Haskell、Ruby、Scala、およびTypeScriptのすべての言語には負の係数があり、これらの言語が平均よりも欠陥修正コミットを行う可能性が低いことを示しています。
TypeScriptの開発経験は、JavaScriptを大幅に改善したものです。IDEは、その豊富な型情報についてTypeScriptコンパイラーによってリアルタイムで通知されます。これにはいくつかの大きな利点があります。たとえば、TypeScriptを使用すると、コードベース全体で名前の変更などのリファクタリングを安全に実行できます。コード補完により、ライブラリが提供する可能性のある関数に関するインラインヘルプを取得できます。それらを覚えたり、オンライン参照で調べたりする必要はもうありません。コンパイルエラーは、コーディング中にビジー状態の赤い赤い波線でIDEに直接報告されます。全体として、これにより、JavaScriptでの作業と比較して、生産性を大幅に向上させることができます。コーディングに費やす時間とデバッグに費やす時間を短縮できます。
Visual Studio Code、WebStorm、Atom、Sublimeなど、TypeScriptに優れたサポートを提供するIDEは数多くあります。
フォームのランタイムエラー、cannot read property 'x' of undefined
またはundefined is not a function
JavaScriptコードのバグが原因であることが非常に一般的です。TypeScriptコンパイラでは認識されない変数(any
型付き変数のプロパティを除く)を使用できないため、そのままの状態でTypeScriptを使用すると、これらの種類のエラーが発生する可能性が既に減少します。ただし、に設定されている変数を誤って利用する可能性がありますundefined
。ただし、TypeScriptの2.0バージョンでは、null可能でない型を使用することにより、これらの種類のエラーをすべて一緒に排除できます。これは次のように機能します。
厳密なnullチェックを有効にすると(--strictNullChecks
コンパイラフラグ)、TypeScriptコンパイラはundefined
、変数をnull許容型として明示的に宣言しない限り、変数に割り当てることができません。たとえばlet x : number = undefined
、コンパイルエラーが発生します。undefined
は数ではないため、これは型理論に完全に適合します。一つは、定義できるx
の和タイプするnumber
と、undefined
これを修正します:let x : number | undefined = undefined
。
型がnull可能であることがわかった場合、つまり、値null
またはのいずれかになる可能性がある型である場合undefined
、TypeScriptコンパイラは、コードが変数を安全に使用できるかどうかを、制御フローベースの型分析を通じて判断できます。言い換えると、変数をチェックするときundefined
、たとえばif
ステートメントを介して、TypeScriptコンパイラは、コードの制御フローのそのブランチの型がnull可能ではなくなったため、安全に使用できると推測します。以下に簡単な例を示します。
let x: number | undefined;
if (x !== undefined) x += 1; // this line will compile, because x is checked.
x += 1; // this line will fail compilation, because x might be undefined.
ビルド中、TypeScript Anders Hejlsbergの2016会議の共同デザイナーが、この機能の詳細な説明とデモを行いました:ビデオ(44:30から56:30まで)。
TypeScriptを使用するには、JavaScriptコードにコンパイルするビルドプロセスが必要です。もちろん、プロジェクトのサイズにもよりますが、ビルドプロセスには数秒しかかかりません。TypeScriptコンパイラはインクリメンタルコンパイル(--watch
コンパイラフラグ)をサポートしているため、その後のすべての変更をより高速にコンパイルできます。
TypeScriptコンパイラは、生成された.jsファイル内のソースマップ情報をインライン化するか、個別の.mapファイルを作成できます。Chrome DevToolsやその他のIDEのようなデバッグユーティリティでソースマップ情報を使用して、JavaScriptの行をTypeScriptで生成した行に関連付けることができます。これにより、TypeScriptコードで直接、ブレークポイントを設定し、実行時に変数を検査できます。ソースマップ情報はかなりうまく機能します。TypeScriptよりもずっと前でしたが、TypeScriptのデバッグは、通常、JavaScriptを直接使用する場合ほど優れていません。this
たとえば、キーワードを考えてみましょう 。this
ES2015以降、クロージャー周辺のキーワードのセマンティクスが変更されたため、this
実行時に呼び出される変数として実際に存在する可能性があります_this
(この回答を参照))。これはデバッグ中に混乱する可能性がありますが、それについて知っているか、JavaScriptコードを調べれば、通常は問題ありません。バベルにもまったく同じ種類の問題があることに注意してください。
TypeScriptコンパイラが実行できる他のいくつかのトリックがあります。たとえば、デコレータに基づいてインターセプトコードを生成したり、さまざまなモジュールシステム用のモジュールロードコードを生成したり、JSXを解析したりします。ただし、Typescriptコンパイラ以外にビルドツールが必要になる可能性があります。たとえば、コードを圧縮する場合は、ビルドプロセスに他のツールを追加する必要があります。
ために利用可能な活字体のコンパイルプラグインがあるのWebPACK、ガルプ、うなり声とそこにほとんどすべての他のJavaScriptのビルドツールが。TypeScriptドキュメントには、それらすべてをカバーするビルドツールとの統合に関するセクションがあります。リンターあなたも多くのビルド時のチェックを希望する場合にも使用可能です。また、Angular 2、React、Ember、SystemJS、Webpack、Gulpなどの他のテクノロジーと組み合わせてTypeScriptを使用できるようにするシードプロジェクトも多数あります。
TypeScriptはJavaScriptに非常に密接に関連しているため、優れた相互運用性機能を備えていますが、TypeScriptでJavaScriptライブラリを操作するには、追加の作業が必要です。TypeScriptの定義は、TypeScriptコンパイラが、関数呼び出しが実際に不正なステートメントであるか、そうでない_.groupBy
かを理解するために必要です。これらの関数の定義はファイルに配置されます。angular.copy
$.fadeOut
.d.ts
定義が取ることができる最も単純な形式は、識別子を何らかの方法で使用できるようにすることです。たとえば、Lodashを使用する場合、1行の定義ファイルでdeclare var _ : any
必要な関数を呼び出す_
ことができますが、もちろん、間違いをすることもでき_.foobar()
ます。これは、正当なTypeScript呼び出しですが、もちろん、実行時の不正な呼び出し。適切な型のサポートとコード補完が必要な場合は、定義ファイルをより正確にする必要があります(例については、lodashの定義を参照してください)。
独自の型定義が事前にパッケージされたNpmモジュールは、TypeScriptコンパイラーによって自動的に理解されます(ドキュメントを参照)。独自の定義を含まない他のほとんどの人気のあるJavaScriptライブラリの場合、誰かがすでに別のnpmモジュールを通じて型定義を利用できるようにしています。これらのモジュールには「@ types /」というプレフィックスが付いており、DefinitelyTypedと呼ばれるGithubリポジトリから取得されます。
注意点が1つあります。型の定義は、実行時に使用しているライブラリのバージョンと一致している必要があります。そうでない場合、TypeScriptは、関数の呼び出しや、存在する変数の逆参照を禁止したり、関数の呼び出しや、存在しない変数の逆参照を許可したりすることがあります。これは、型がコンパイル時のランタイムと一致しないためです。 。したがって、使用しているライブラリの正しいバージョンのタイプ定義の正しいバージョンをロードするようにしてください。
正直なところ、これには少し手間がかかり、TypeScriptを選択しない理由の1つである可能性がありますが、代わりに、Babelのような、型定義を取得する必要がないものを選びます。一方、何をしているのかわかっている場合は、定義ファイルの誤りや欠落によって引き起こされるあらゆる種類の問題を簡単に克服できます。
任意の.js
ファイルの名前をファイルに変更し.ts
、TypeScriptコンパイラを実行して、構文的に出力と同じJavaScriptコードを取得できます(そもそも構文的に正しい場合)。TypeScriptコンパイラでコンパイルエラーが発生した場合でも、.js
ファイルが生成されます。フラグ.js
付きの入力としてファイルを受け入れることもできます--allowJs
。これにより、すぐにTypeScriptを開始できます。残念ながら、コンパイルエラーは最初に発生する可能性があります。これらは、他のコンパイラで慣れ親しんでいるようなショーストップエラーではないことを覚えておく必要があります。
JavaScriptプロジェクトをTypeScriptプロジェクトに変換するときに最初に発生するコンパイルエラーは、TypeScriptの性質上避けられません。TypeScriptはすべてのコードの有効性をチェックするため、使用されるすべての関数と変数について知る必要があります。したがって、すべてのタイプ定義を適切に配置する必要があります。そうしないと、コンパイルエラーが発生します。上記の章で述べたように、ほとんどすべてのJavaScriptフレームワークには.d.ts
、DefinitelyTypedパッケージのインストールで簡単に取得できるファイルがあります。。ただし、TypeScript定義を使用できないあいまいなライブラリを使用したか、JavaScriptプリミティブをポリフィルした可能性があります。その場合、コンパイルエラーを解消するには、これらのビットの型定義を提供する必要があります。.d.ts
ファイルを作成してtsconfig.jsonのfiles
配列に含めるだけで、TypeScriptコンパイラーによって常に考慮されます。その中で、TypeScriptがタイプとして認識しないビットを宣言しますany
。すべてのエラーを削除したら、必要に応じて、これらの部分にタイピングを徐々に導入することができます。
TypeScriptをビルドパイプラインに取り込むには、ビルドパイプラインの(再)構成に関する作業も必要になります。コンパイルに関する章で述べたように、そこには多くの優れたリソースがあり、作業したいツールの組み合わせを使用するシードプロジェクトを探すことをお勧めします。
最大のハードルは学習曲線です。最初は小さなプロジェクトで遊んでみることをお勧めします。それがどのように機能するか、どのように構築するか、どのファイルを使用するか、どのように構成するか、どのようにIDEで機能するか、どのように構造化されるか、どのツールを使用するかなどを見てください。何をしているの。たとえば、72時間で600k行をtypescriptに変換する方法については、このブログをご覧ください)。ジャンプする前に、言語をよく理解していることを確認してください。
TypeScriptはオープンソース(Apache 2ライセンス、GitHubを参照)で、Microsoftによってサポートされています。C#の主任アーキテクトであるAnders Hejlsbergがプロジェクトの先頭に立っています。これは非常にアクティブなプロジェクトです。TypeScriptチームは過去数年で多くの新機能をリリースしてきましたが、多くの優れた機能がまだリリースされる予定です(ロードマップを参照)。
採用と人気に関するいくつかの事実:
npm
(またはyarn
)だけinstall @types/foo
です。回答を更新できますか?
TypeScriptは、CSSに対してlessまたはsassが行うことと同様のことを行います。それらはそのスーパーセットです。つまり、作成するすべてのJSコードは有効なTypeScriptコードです。さらに、言語に追加された他の便利な機能を使用でき、変換されたコードは有効なjsになります。結果のコードを使用するJSバージョンを設定することもできます。
現在、TypeScriptはES2015のスーパーセットであるため、新しいjs機能の学習を開始し、プロジェクトに必要な標準にトランスパイルするのに適しています。
」 TypeScript Fundamentals」 -Dan Wahlinと John PapaによるPluralsightビデオコースは、TypeScript 1.8を反映するように更新されており(2016年3月25日)、 Typescriptの紹介です。
私にとって本当に優れた機能は、インテリセンスの優れた可能性に加えて、クラス、インターフェイス、モジュール、AMDの実装の容易さ、IEで呼び出されたときにVisual Studio Typescriptデバッガーを使用できることです。
要約すると、Typescriptを意図したとおりに使用すると、JavaScriptプログラミングの信頼性が高まり、簡単になります。これにより、完全なSDLCよりもJavaScriptプログラマの生産性を大幅に向上させることができます。
Ecmaスクリプト5(ES5)。これは、すべてのブラウザーでサポートされ、プリコンパイルされています。ES6 / ES2015とES / 2016には今年多くの変更が加えられたため、これらの変更を表示するには、TypeScriptに注意を払う必要があります。
•TypeScriptはタイプです->各プロパティとメソッドのデータ型を定義する必要があることを意味します。C#を知っていれば、Typescriptは簡単に理解できます。
•TypeScriptの大きな利点は、生産に入る前の早い段階でType関連の問題を特定できることです。これにより、タイプの不一致がある場合に単体テストが失敗する可能性があります。