web-dev-qa-db-ja.com

ES2018などのTypeScriptで最新のJavaScript機能を使用する

TypeScriptsのドキュメントの構成を検索してみましたが、簡単な質問の答えが見つからないようです。

簡単に言うと、TypeScriptコンパイラをどのように構成して、使用しているJavaScript機能セットを認識させるのでしょうか。

たとえば、ES2019が上陸すると、「ああ、その一部を取得したい」と思います。その状況で、コンパイラが必要なものをトランスパイルおよびポリフィルできるようにするには、何をアップグレードする必要がありますか?

Tsconfigのlibオプションは私を混乱させ、ドキュメントは利用可能なライブラリについてあまり説明していません。直接それらを見つけることもできません。

それで、ES2019が出て、それにlibオプションを追加するとします(1つあると仮定します)。つまり、ES2019の機能を使用できるようになりますか? ES2019以降のすべてをサポートしたい場合、その下にある他のすべてのバージョンのライブラリを追加する必要がありますか?または、ES2019 libを追加すると、必要なものがすべて提供されますか?

これらのライブラリはどこから来たのですか?それらはコアTypeScriptライブラリの一部なので、さらにアップグレードするには、別のパッケージをアップグレードする必要がありますか?それともすべて機能しますか?

最後に、そのバージョンの仕様を完全にサポートするために必要なすべてのlibを提供します。それとも機能のサブセットですか?

私たちのプロジェクトでは、現在TypeScriptバージョン2.5.3を使用しています

私はそれが非常に多くの質問であることを理解しているので、何かに関する情報、またはドキュメントへのリンクは大いに感謝されます.

18
ste2425

ストーリーはもう少し複雑です。まず、言語機能とランタイム機能の2つに分ける必要があります。

ES言語機能

言語機能とは、コアとなるJavaScript言語構文の変更を意味します。たとえば、_ES 2015_は、クラス、矢印関数(_=>_)、および_for-of_の反復のサポートを追加します

TypeScriptはすべての安定した言語機能の提案をできるだけ早く実装しようとし、コンパイラーのtargetオプションとして指定されたESバージョンにそれらをダウンコンパイルします。つまり、これは、最新のTypeScriptコンパイラを使用していて、新しい_ES 2019_言語機能のサポートを追加している場合、_ES3_まで完全にダウンコンパイルできることを意味します。 TypeScriptは、対象のESのどのバージョンでもそのような機能を動作させるために必要なコードを生成します。

そして今、あなたはこれが実際に動いているのを見ることができます。 _ES5_をターゲットとする場合、矢印関数は通常のfunctionsにコンパイルされ、__this_ローカル変数を使用してthisをキャプチャします。クラスは、prototypeセットの関数と適切なフィールドにコンパイルされます。

ESランタイム機能

言語機能に加えて、利用可能な組み込みオブジェクトタイプ、およびそれらのランタイムオブジェクトが持つメソッドとフィールドを説明する特定のランタイム機能があります。最近のバージョンのESの新しいオブジェクトタイプの例は、PromiseまたはProxyです。

TypeScriptはこのような機能のポリフィルを提供していません。ランタイムがこれらの機能をサポートしていない場合、使用する場合は独自のポリフィル実装が必要になります。

ただし、TypeScriptは実行時に存在する組み込みオブジェクトとそのメソッド/フィールドが何であるかを知る必要があります。ここでlibオプションを使用します。これにより、ランタイム環境の外観を指定できます。

したがって、たとえば_es5_をターゲットにすることができますが、ランタイムが_es2015_標準に準拠したすべての組み込みオブジェクトを含むことを指定します(一部はランタイム自体によって実装される場合があり、その他はあなたはポリフィルを通して)

2つの交差

上記の分割は、一部の言語機能が特定の組み込みオブジェクトおよびメソッドの存在に依存しているという点で単純化されています。

たとえば、_async/await_言語機能は、promiseの存在に依存しています。したがって、_async/await_を使用してターゲット_es5_を使用すると、Promiseコンストラクターが存在しないというエラーが発生します。 _es5_をターゲットにして_lib: [ 'es2015', 'dom' ]_を指定した場合、コンパイラーに_es5_にダウンコンパイルしたい場合でも、実行時にPromiseコンストラクターが特定のlibで表される_es2015_ランタイム仕様に従って存在します(これがどのように発生するかはコンパイラーの問題ではなく、ポリフィルまたは組み込みのランタイム動作)。

一般に、このような依存が存在する場合、TypeScriptコンパイラーは特定の型が欠落しているというエラーを発行し、libをアップグレードするか、ターゲットを変更(使用するデフォルトのlibを変更)できますが、ランタイムに必要なサポート。

例外

言語機能を_es3_まで完全にダウンコンパイルすることが常に可能であるとは限りません(ランタイム機能がないため、または機能の実装に高いコストがかかるため、コンパイラーの優先事項にならないため)チーム)。サポートされていない_es3_を対象とする場合の例は、プロパティアクセサー(get/set)です。ただし、サポートされていない言語機能とターゲットの組み合わせを使用している場合は、コンパイラから警告が表示されます。