angular - Angular2 为什么我们需要 es6-shim

Question

按照Angular2 快速入门指南，我们被指示es6-shim在 2 个地方包括：

1)index.html

<script src="node_modules/es6-shim/es6-shim.min.js"></script>

2)typings.json

"ambientDependencies": {
  "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#6697d6f7dadbf5773cb40ecda35a76027e0783b2"
}

我的印象是我们正在将es6代码编译为es5.

配置在tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    ...

如果最终结果是浏览器正在加载es5，为什么浏览器需要 shimses6呢？

score 29 · Accepted Answer

您的编辑器使用打字来为您提供代码提示/智能感知，并且es6-shim.min.js是模拟 ES5 浏览器的 ES6 功能的代码。其中一些功能是Promise，Array.from()...

当你的代码被翻译成 ES5 时，你需要包含es6-shim，这样你就可以使用其中的那些新特性......考虑这个 ES6 代码：

let test1 = () => 123 + 456;
let test2 = new Promise((resolve, reject ) => {});

它将被翻译成 ES5 代码：

var test1 = function () { return 123 + 456; };
var test2 = new Promise(function (resolve, reject) { });

但没有es6-shim Promise将是未定义的......

score 13 · Accepted Answer

TypeScript 没有内置的 polyfill。它没有转换某些功能，这就是 polyfill 的用武之地es-shim。

TypeScript 定义文件将在您选择的编辑器中为您提供打字支持，es-shim并将提供 TypeScript 不会转换为 ES5 代码的功能的实现。

TypeScript 不会转译的一些此类功能是：

一般的做法是：

经验法则是，如果有一个规范/健全的发射没有巨大的性能命中，我们将尝试支持它。我们不添加任何运行时方法或数据结构，这更多是 core.js （或任何 pollyfil）所要做的。-来源（TypeScript 开发人员）

2 回答 2