ECMAScript 6 and The Future of JavaScript

ECMAScript 6 and The Future of JavaScript

Andy Holland

Can you believe that there haven’t been any updates to the ECMAScript since the ES5 standardization in 2009? It’s surprising given how much JavaScript has evolved since then, no longer limited to the web but offering far more in terms of its functionality. What’s more, this is no longer a scripting language that runs solely on the side of the client.

Clearly, it’s been a long time coming for an update and most developers were pleased to see documentation for ECMAScript 6, otherwise known as ‘Harmony’ which surfaced in 2014. With more syntax added to the language, this is one of the most fundamental changes to JavaScript since the abandoned ES4.

Despite the ongoing work, ES6 is yet to see all features initiated across browsers. Some of the main attributes include block bindings, classes, generators, template strings, arrow functions and modules to name a few. While it would be easy to get into the technicalities of ES6, there’s probably only one question that needs to be answered…

Is it worth switching to ES6 now, or waiting?

As is often the case, there isn’t a simple answer as to whether ES6 is worth using just yet. This is largely dependent on the size of the project as well as the features required. However, for those of you that do want to utilise the impressive functions, much of the tooling is available across most major platforms.

Not surprisingly, Internet Explorer is yet to support these functions but a useful compatibility table for the ES6 – found on github – gives a detailed overview of which browsers support what features. With ES6 still in production, there are two main options to make use of.

Transpiling

By utilising an automation tool such as ‘gulp’ you can transpile ES6 to ES5. This enables any ES6 code to run on existing browsers which allows you to include a transpiler in your development workflow. Given ES5 runs across all browsers, this means your code base will work on all existing platforms.

The most common transpilers include ‘Babel’ which is open source and arguably outputs the most refined ES5 code; as well as ‘Traceur’ which is maintained by Google and maps ES5 to ES6.

Polyfilling

The other option is polyfilling otherwise known as ‘Shimming’. This allows you to future proof any code as a polyfill assists in giving extra functionality which is not built in the browser. This also allows you to define certain functions in ES6 by implementing corresponding JavaScripts files for the polyfill. Thus, you can run code without any concern that it won’t be compatible on any browsers. However, some ES6 features cannot be polyfilled due to the language features which are not syntactic sugar.

Aside from these options, there are some useful browser extensions which allow you to utilise ES6 in your browser, if not to have a play around with. The scratch js extension for Chrome comes recommended as does plunkr or Babel REPL.

Although it’s still in the early stages, the future of JavaScript looks bright with ES6. While there’s no need to implement this straight away, it may be worth understanding this new specification before it becomes the norm.

Andy Holland

Author Andy Holland

More posts by Andy Holland