javascript - 截至2018年支持ES6(ECMAScript 2015)

Question

作为长期从事JavaScript编程的程序员，尽管阅读了许多文章，但我仍然有以下不清楚的问题。

查看ES6 (ECMAScript 2015) support by browsers，我可以看到它的支持水平远低于Node.js的支持水平，所以问题是

如果Node.js和浏览器都使用modern V8 engine，为什么支持级别如此不同？

看看ES6 support in Node.js，我发现现在确实很少有ES6功能不受支持。但是，图表中所支持的含义到底是什么？即

这是否意味着即使我使用支持ES6的功能编写代码，我仍然需要use the Babel compiler to compile ES6 code to ES5以便Node.js可以使用它？

对于为Node.js运行的TypeScript ES6样式的JavaScript代码，它们仍然需要是transpiled into an ES5 compatible form，尽管Node.js几乎涵盖了所有ES6的功能，对吗？即

对于以下代码，

class Animal {
    constructor(public name) { }
    move(meters) {
        console.log(this.name + " moved " + meters + "m.");
    }
}

class Snake extends Animal {
    move() {
        console.log("Slithering...");
        super.move(5);
    }
}

class Horse extends Animal {
    move() {
        console.log("Galloping...");
        super.move(45);
    }

var sam = new Snake("Sammy the Python")
var tom: Animal = new Horse("Tommy the Palomino")

sam.move()
tom.move(34)

是否需要将其转换为与ES5兼容的形式才能与Node.js一起运行？

最后，我可以尝试使用上述TypeScript/ES6代码的任何在线站点吗？

我将其复制到chrome控制台中，并得到了我不理解的错误-Unexpected strict mode reserved word和

我在http://www.typescriptlang.org/play/index.html上尝试过，但是console输出在那里不起作用。

请帮忙。谢谢。

Answer 1

Looking at the ES6 (ECMAScript 2015) support by browsers, I can see that the supporting level is much less than that of Node.js, so the question is,

其中有许多不同的浏览器和许多不同的Javascript引擎，每个浏览器都具有自己的ES6支持级别。通常，最新版本的node.js是V8引擎支持的最新版本。许多浏览器的发布周期较长，可能不是最新的，但每种浏览器都不相同，并且具有各自的发布策略和对ES6的支持级别。

If both Node.js and browsers are using the modern V8 engine, why supporting level are so different?

如果您将最新版本的node.js与Windows上最新版本的Chrome进行比较，则支持的差异不会太大。您正在查看的ES6支持表对我来说似乎很旧。例如，Chrome很久以来就一直支持 Set对象，但是您的图表显示为 false。

Looking at the ES6 support in Node.js, I can see really really few ES6 features are unsupported now. However, what exactly does the supported means in the chart? I.e.,

受支持意味着您可以直接使用该功能而无需编译器，但是该功能的准确度取决于声明该功能的文档的来源。一些文档对给定功能的所有各种边缘情况进行了广泛的测试。
其他人只是在寻找一般的实现。因此，例如，如果您正在寻找对 Set对象的支持，并且说“受支持”，那么那意味着您可以只编写使用 Set对象的纯Javascript，它就可以正常工作。该文件的准确性取决于其数据来源和测试的彻底性。

Does it means even I write using the support ES6 features, I still need to use the Babel compiler to compile ES6 code to ES5 for Node.js to use it?

否。在支持ES6中给定功能的Javascript引擎中，您可以编写该功能的ES6代码并直接在该Javascript引擎中运行。无需转码。

For TypeScript ES6-style JavaScript code that runs for Node.js, they are still need to be transpiled into an ES5 compatible form, despite that Node.js almost cover all ES6 featues, right? I.e.,

您显示的类定义是普通的ES6代码。就像在支持ES6的Javascript引擎中一样，它们也可以正常工作。

如果您编写Typescript代码，则必须将TypeScript转换为Javascript，因为据我所知，没有Java脚本引擎直接支持TypeScript。从TypeScript转换为Java脚本时，通常可以根据需要指定是让编译器生成ES5兼容代码(将在ES5引擎或ES6引擎中运行)还是ES6兼容代码(仅在ES6引擎中运行)，具体取决于您的目标环境有什么能力。

Does it need to be transpiled into an ES5 compatible form to runs with Node.js or not?

您的特定代码似乎包含至少一个需要转换的TypeScript样式变量声明。其余的看起来像普通的ES6 Javascript，可以在任何ES6引擎中运行而无需编译。

当我删除TypeScript时，修复代码中的一些语法错误并正确实现 Animal构造函数，然后此代码在node.js v8.8.1(这是我当前已安装的)和Chrome 63.0.3239.132，Edge 41.16299中正常运行Windows 10上的.15.0和Firefox 57.0.4:

    // Generic ES6 code

    class Animal {
        constructor(name) { 
            this.name = name;
        }
        move(meters) {
            console.log(this.name + " moved " + meters + "m.");
        }
    }
    
    class Snake extends Animal {
        move() {
            console.log("Slithering...");
            super.move(5);
        }
    }
    
    class Horse extends Animal {
        move() {
            console.log("Galloping...");
            super.move(45);
        }
    }
    
    var sam = new Snake("Sammy the Python");
    var tom = new Horse("Tommy the Palomino");
    
    sam.move();
    tom.move(34);

您可以在想要查看结果的任何浏览器中自己运行此片段(假定浏览器足够现代以支持堆栈溢出片段)。它可以在我拥有的所有当前版本的浏览器中使用，但IE 11.192.16299.0除外(IE不支持ES6也就不足为奇了)。

I copy it to my chrome console, and got an error that I don't understand - Unexpected strict mode reserved word,

当我尝试在node.js中运行您的代码直到我从其中删除TypeScript使其只是普通的ES6时，这发生在我身上。我认为此特定错误是由以下行中的 public引起的:

constructor(public name) { }

因为那不是ES6规范的一部分(显然是TypeScript的一部分)。

It seems that there's one question you're dying to ask, but haven't exactly articulated is: "How do you know whether you have to transpile or not?".

答案是，您必须了解希望在其中运行的目标环境与计划使用的最新功能之间的交叉。如果您正在编写仅在node.js中运行的服务器端代码，那么它会简单得多。检查一个全面的表，例如 http://node.green/，研究它对计划使用的node.js版本和所涉及功能的说明。如果它指示您应该能够使用该功能，则使用该功能编写代码，为此编写一个测试用例，并验证您编写的代码和正在使用的功能都可以正常工作。将其添加到有关在该版本的node.js中可以使用和不能使用的知识的知识体系。然后，您可以假定所有将来的node.js版本都将支持该功能。

如果您正在编写要在浏览器中运行的代码，则生活会更加复杂。如果您打算支持许多浏览器，并且真的不想完全担心ES6的支持，那么只需将其转换为ES5目标即可开展业务。

如果要使用非编译代码，则需要在许多浏览器中进行大量测试。您必须首先准确指定要支持的浏览器的哪个版本，然后必须编写代码和测试用例，并且必须在计划支持的每种浏览器中进行测试。确实没有捷径可走。当发现不可用的东西时，您将不得不寻找polyfill或解决方法，或者停止使用该ES6功能。