使用ECMAScript 6

我正在寻找一种方法来在浏览器的控制台中运行ECMAScript 6代码，但大多数浏览器不支持我正在寻找的function。 例如Firefox是唯一支持箭头function的浏览器。

有没有办法（扩展，用户等）我可以在Chrome上运行这些function？

Answer 1

在Chrome中，大部分ES6function都隐藏在名为“实验JavaScriptfunction”的标志后面。 访问chrome://flags/#enable-javascript-harmony ，启用此标志，重新启动Chrome，您将获得许多新function 。

箭头function尚未在V8 / Chrome中实现 ，所以此标志不会“解锁”箭头function。

由于箭头函数是一个语法变化，所以不能在不改变JavaScriptparsing方式的情况下支持这个语法。 如果您喜欢在ES6中开发，那么您可以编写ES6代码，并使用ES6-to-ES5编译器生成与所有现有浏览器兼容的JavaScript代码。

例如，请参阅https://github.com/google/traceur-compiler 。 在编写时，它支持ES6的所有新语法function 。 与在这个答案顶部提到的国旗一起，你会得到非常接近所需的结果。

如果要直接从控制台运行ES6语法，则可以尝试覆盖控制台的JavaScript评估程序（例如在执行代码之前运行Traceur预处理程序）。 如果你喜欢这样做，看看这个答案 ，了解如何修改开发人员工具的行为。

Answer 2

巴别是一个很好的ES6试用版。 您可以在网站的“试用”部分的浏览器中运行ES6。 它的function类似于jsfiddle。

箭头例如：

 let add = (x,y) => x + y; let result = add(1,1); console.log(result); 

显示结果 2 。

Babel“transpiles”，即将ES6转换成可以通过当前浏览器技术运行的ES5 javascript。 你可以通过npm install -g babel安装Babel。 安装完成后，可以将上面的箭头保存到文件中。 假设我们称之为“ES6.js”。 假设你已经安装了节点，那么在命令行中输出到节点：

babel ES6.js | node

你会看到输出2 。 您可以使用以下命令永久保存已翻译的文件：

babel ES6.js --out-file output.js

output.js“transpiled”：

 "use strict"; var add = function (x, y) { return x + y; }; var result = add(1, 2); console.log(result); 

当然可以在任何现代浏览器中运行。

使用类的示例

ES6是一个快速移动的目标。 请参阅兼容性表格以查找诸如Traceur和Babel等转换器支持的function以及浏览器支持。 您甚至可以展开图表来查看用于validation兼容性的testing：

要在浏览器中尝试出色的ES6，请尝试Firefox每晚构build或Chrome发布渠道

Answer 3

更新：

现在，除了IE和Opera Mini以外，所有的浏览器都可以使用Arrowfunction。 看caniuse 。

对于其他实验ECMAScript 6function，您可以转到chrome：// flags /＃enable-javascript-harmony并启用JavaScript Harmony标志。 对于某些function，您可能必须使用启用该标志的Chrome Canary ，或者使用像Babel这样的ES6转换器。

---

箭头函数在Chrome Canary中运行 ， chrome://flags/#enable-javascript-harmony了chrome://flags/#enable-javascript-harmony标志。

Chrome Canary目前的版本为47.只要Google Chrome升级到版本47，您就可以使用Google Chrome内部的箭头function（但只有在启用了javascript-harmony标志的情况下才能使用）。 在此之前，您可以使用Chrome Canary为未来做准备，或者您可以使用Babel这样的ES6转换器。

编辑：箭头function现在在谷歌浏览器中工作！ 通过转到chrome://flags/#enable-javascript-harmony并点击enable，启用JavaScript和谐标志。

Answer 4

只要使用严格模式，进入封闭（不需要，但这是一个很好的方法），Chrome将能够执行您的代码为ES6 …

 (function(){ 'use strict'; //your ES6 code... })(); 

Answer 5

截至2015年11月， Firefox和Edge已经领先ES6赛事，如果你想要实验Chrome缺乏的function，可以使用它们。 边缘有类/子类和Firefox有代理 ; 他们之间几乎所有的ES6function 。

如果您必须在Chrome控制台中使用ES6，那么有一个简单，经过validation的方法：

耐心一点。

浏览器正在采用ES6，即使是Safari，也一直在大部分的HTML5标准上。 给Google时间，他们将逐一实现ES6function。 例如箭头function现在可用，在生产通道和没有标志。

不要期待扩展; 你不能一行一行地把ES6转换成ES5，所以我们不能只用Babel来 扩展控制台。

确实有一个实验js的标志，但它存在的原因很好。 V8有代理，但在旧（非标准）的语法，并有安全问题 。 它的解构也是不完整的：你会发现在某些情况下它是有效的，而在它来的情况下则不行。

如果您只想玩ES6，只需使用Edge / Firefox即可。 他们都涵盖了几乎整个巴别塔，有控制台和debugging器，并具有巴别不能提供的function。