Question

我试图了解Typescript编译器何时会转换代码以使其与我指定的目标ECMAScript版本（ES5或ES3）兼容。

例如，TSC会将for(var int of intArray)转换为罚款，但它不会转换Number.isInteger()（这是ES6功能，根据w3schools）。

IE中不支持

Number.isInteger()＆lt; 11.0，所以这是一个问题。 Visual Studio（和VS代码）不提供不兼容的警告，并且不会被编译。

我可以期待什么能够被转化，以及什么赢了？我最初预计一切都会被转化，所以我不必跟踪这样的事情，但事实似乎并非如此。

Answer 1

编译器支持基于您告诉它使用的库的功能有两种方法可以控制编译器将使用哪个lib，方法是使用 target 和 lib compiler options。

如上所述：

如果未指定--lib，则会注入默认库。默认   注入的库是：
  ►对于--target ES5：DOM，ES5，ScriptHost
  ►为   --target ES6：DOM，ES6，DOM.Iterable，ScriptHost

所有不同的库都是part of the project。

如果您定位es3或es5，则无法使用Number.isInteger()（如您所述）es6功能。
如果您有一个polyfil，那么您仍然可以使用es5 lib定位es6：

--target es5 --lib DOM,ES6,ScriptHost

或者您可以复制lib.es6.d.ts的定义：

interface NumberConstructor {
    isInteger(number: number): boolean;
}

无论目标如何，您都可以使用let，const，for/of等内容的原因是编译器知道如何生成等效代码，即使该功能不是。支持所选目标。

例如：

const arr = [1, 2, 3];
for (let num of arr) {}

编译为：

var arr = [1, 2, 3];
for (var _i = 0, arr_1 = arr; _i < arr_1.length; _i++) {
    var num = arr_1[_i];
}

如果未指定目标。
如您所见，const和let已转为var，for/in已转为常规for。

Number.isInteger()有所不同，它是某些目标中不存在的功能，例如Promise和＆＃39; Symbol`。
编译器不会添加polyfill，由你来添加它然后告诉编译器它在那里。

Answer 2

TypeScript 转换但不 polyfill 。因此，考虑它的一种方法是，target中任何无效语法的内容都将被转换为到有效语法。例如，当您使用class关键字并将目标设置为ES5时，它会将其转换为：

class Greeter {
}

到此：

var Greeter = /** @class */ (function () {
    function Greeter() {
    }
    return Greeter;
}());

（您可以使用此here进行更多操作。）

另一方面，它不会添加缺少的功能，您必须自己 polyfill 。 Number.isInteger()是有效的ES5语法，它不是ES5中存在的功能。您可以通过导入babel-polyfill（使用引擎盖下的core-js）或使用polyfill.io等服务来自行填充此内容。

注意：不要将lib选项与polyfill混淆。此不 polyfill功能。它只是告诉TypeScript充当那些ES版本中的功能，因此它会适当地键入它们。对于您支持的浏览器，您仍然需要自己处理polyfill。如果您没有指定相应的lib，TypeScript会抱怨它不知道Number.isInteger()代表什么。

我不知道TypeScript转换的功能的完整列表，但您可以看到TypeScript + core-js polyfills here的表格。关于polyfill与翻译的更多阅读here。

在针对ES5 / ES3时，Typescript会有什么变化？

2 个答案: