使用TypeScript和Traceur有什么好处？

Question

您可以将TypeScript配置为输出ES5或ES6。只要您想在不本身支持ES6的平台上运行应用程序，就必须使用Traceur等编译器（包括Traceur运行时库）将ES6编译为ES5。

这样做有什么好处而不是简单地告诉TypeScript输出ES5？ （我不认为该应用程序将仅针对本机ES6平台）

据我所知，你不能在TypeScript（1.5）中编写一个无法在ES5上运行的程序（假设程序编译并包含正确的库）。我错了吗？

Answer 1

使用Babel或Traceur而非TypeScript的原因

到目前为止，Typescript团队选择不使生成的代码依赖于运行时。 ES6的某些功能可以通过polyfills轻松地与TS一起使用（例如：ES6 Promises）。其他功能需要转换器和polyfill（例如：ES6发生器）的配合。使用带TS的发生器是可能的（因为TS 1.6），但目标必须是ES6。这是使用Babel或Traceur的一个很好的理由。

不使用Babel或Traceur而非TypeScript

的原因

但是还有其他很好的理由不使用Babel和Traceur。只是尝试转换一些ES6代码。

ES6代码：

let list = ['ab', 'cd'];
for (let item of list) {
    console.log(item);
}

TypeScript生成的ES5（使用the Playground）：

var list = ['ab', 'cd'];
for (var _i = 0; _i < list.length; _i++) {
      var item = list[_i];
      console.log(item);
}

Traceur制作的ES5（使用the REPL）：

$traceurRuntime.ModuleStore.getAnonymousModule(function() {
    "use strict";
    var list = ['ab', 'cd'];
    var $__4 = true;
    var $__5 = false;
    var $__6 = undefined;
    try {
      for (var $__2 = void 0,
          $__1 = (list)[$traceurRuntime.toProperty(Symbol.iterator)](); !($__4 = ($__2 = $__1.next()).done); $__4 = true) {
        var item = $__2.value;
        {
          console.log(item);
        }
      }
    } catch ($__7) {
      $__5 = true;
      $__6 = $__7;
    } finally {
      try {
        if (!$__4 && $__1.return != null) {
          $__1.return();
        }
      } finally {
        if ($__5) {
          throw $__6;
        }
      }
    }
    return {};
});
//# sourceURL=traceured.js

Babel制作的ES5（使用the REPL）：

'use strict';

var list = ['ab', 'cd'];
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;

try {
    for (var _iterator = list[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
        var item = _step.value;

        console.log(item);
    }
} catch (err) {
    _didIteratorError = true;
    _iteratorError = err;
} finally {
    try {
        if (!_iteratorNormalCompletion && _iterator['return']) {
            _iterator['return']();
        }
    } finally {
        if (_didIteratorError) {
            throw _iteratorError;
        }
    }
}

来自Traceur和Babel的解决方案很难看，因为变量list可能是an ES6 iterable，而这些转换器并不知道这些类型。 TypeScript推断list的类型是数组string[]，它只生成数组的代码。