TypeScript 'target'とBabel

Question

私はTypeScriptとWebpackを使用しています。TypeScriptコードをES5コードに翻訳することについて質問があります。

targetオプション（tsconfig.json）をES5に設定すると、私は正しく理解しても、バベルローダーは必要ありませんか？右？

もしそうでなければ、違いはどこですか？

Answer 1

答えは次のとおりです。これは、使用するES6の機能によって異なります。 TypeScriptはそれらのほとんどを扱い、ES5にコンパイルしますが、for..ofループのようないくつかの例外があります。 for..ofループは、イテレータに基づくES6機能です。オブジェクトごとに、メソッドを定義して[Symbol.iterator]というキーの下に置くことができます。このメソッドはfor..of loopによってオブジェクトを反復処理するために使用されます。詳細for example hereを見つけることができます。しかし、TypeScriptターゲットをES5に設定すると、これは機能しません。これは、ES5の場合、TypeScriptは反復処理するオブジェクトに明示的なlengthプロパティがあり、整数インデックス型（配列のような）であると仮定してループを基本forループにコンパイルするためです。例を見てください：

for (const a of someObject) { 
//some operations 
} 

あなたはES5に目標を設定している場合、これはあなたがそのオブジェクトに0からlength-1に両方lengthと整数の性質を提供するために、必要とする

for (var _i = 0; _i < someObject.length; _i++) { 
    var a = someObject[_i]; 
    //some operations 
} 

にコンパイルされます。これは、イテレータのアイデアに反するものです。イテレータは、オブジェクトを反復処理する方法をES6で自由に定義できます。

要約すると、ES5ターゲットのTypeScriptコードでES6機能を使用する予定がある場合は、コンパイル先を確認してください。出力コードにいくつかの制限がある場合は、targetをES6に設定し、結果にBabelを使用します。