Using EMCAScript 6 Today

I have been avoiding writing about ECMAScript 6 (E6)[6] for the past couple of years. This is mostly because the standard was not finalized, and consequently most browsers/engines were implementing different and often unstable versions of the various new features. With the E6 spec stabilizing almost a year ago now[1] and the final release date scheduled sometime later this year[1], I expected most browsers/engines would have implemented much of it, with bake time to work out the bugs. However, it has become obvious that I was overly optimistic[2]. Nevertheless, E6 is coming and it’s time to start introducing some of the more supported features by beginning a series dedicated to the ECMAScript 6 features.

For starters, lets discuss the state of the web and how to begin using E6 today.

How do it…

Most of the browsers have already begun to support some of the new features. In IE 11 and the technical preview, many E6 features are available without doing anything special. In Chrome, some changes like new syntax are widely available, but others like new bindings require that the block of code be in strict mode. And in FireFox, some features are broadly available, while others require a special script tag declaration. For the broadest support across all browsers, use the following:

<script type="application/javascript;version=1.7">// or version=1.8
(function() {
"use strict";
// Your code here

Unfortunately, Safari is lagging behind the other browsers in supporting new E6 features. Additionally, Node.js only supports a limited features set.

Consequently, an industry of precompiler/transpilers has sprung up to support E6 features in an E5 world[3]. I have had some limited experience with the BabelJs[5] compiler for writing E6 and converting it to E5 on the web. For server-side JavaScript, EchoJs[4] comes highly recommended instead of using straight Node.js.

When not using a precompiler, it is best to check out a compatibility table[2] to make sure the target feature is available in your desired environments. Generally, developers should avoid using E6 features without a precompiler, but braver developers, who forge ahead anyway, are limited to a few syntax and binding changes.

In Summary…

Frankly, before doing some research I expected far more browser support by now, and am rather disappointed in the state of E6, both on and off the web. Without using a precompiler, iOS and Safari users will not be able to use websites driven with E6 technologies, so a developer would need to have E6 and E5 version of their JavaScript and switch the loaded script on availability of E6 features. This is rather undesirable, as maintaining two separate code bases for the same features is wasteful a engineering effort.

Let me know about your experiences with ECMAScript 6 and its transpilers.


  1. The ECMAScript 6 schedule changes
  2. ECMAScript compatibility table
  3. ECMAScript 6 Tools
  4. EchoJS
  5. BabelJs
  6. ECMAScript Draft Specification