TypeScript“目标”和 Babel

Question

我正在使用TypeScriptwith ，并且对将代码转换为代码Webpack有疑问。TypeScriptES5

target如果我理解正确的话，如果我将选项 (in tsconfig.json) 设置为ES5? ，我不需要任何 babel loader。正确的？

如果不是，那么差异在哪里？

Answer 1

答案是：视情况而定。这取决于您要使用 ES6 的哪些功能。TypeScript 可以处理其中的大部分并可以很好地编译为 ES5，但也有一些例外，例如：for..of 循环。for..of 循环是基于迭代器的 ES6 功能。对于每个对象，您可以定义一个方法并将其放在调用的键下[Symbol.iterator]，for..of 循环将使用该方法来迭代该对象。例如，您可以在此处找到更多信息。但是，如果将 TypeScript 目标设置为 ES5，则这将不起作用。这是因为在 ES5 中，TypeScript 会将循环编译为基本的 for 循环，假设您迭代的对象具有显式属性length并且是整数索引（如数组）。看例子：

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

如果你将目标设置为 ES5，这将被编译成

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

这要求您提供该对象上从到 的length整数属性。这有点与迭代器的想法相反，在 ES6 中，迭代器允许您自由定义如何迭代对象。0length-1

总结一下：如果您计划在面向 ES5 的 TypeScript 代码中使用 ES6 功能，请确保它们将被编译为什么。如果输出代码有一些限制，请将目标设置为 ES6 并在结果上使用 Babel。