Introduction to ECMAScript 6

ECMAScript is a scripting-language specification—not an actual programing language. ECMA is an acronym for the European Computer Manufacturers Association, a non-profit organization whose current goal is to define standards of communication. (They’re actually now called Ecma International to reflect the fact that they are now a global organization.) Their most well know standard is ECMAScript, and JavaScript is build on the base of this standard. In other words, ECMAScript is the set of instructions to which JavaScript must align itself.

Just like versions, ECMAScript releases new standards with additions and innovations. Until recently, we all worked with ECMAScript 5 which was published in 2009. This standard already had inherent support for JSON (in the past we had to put in unique functions that would take care of this data format).

The latest standard of ECMAScript is the 6th, which was published in 2015—not so long ago. This standard contains a significant reform to the language with many changes and some functional programming additions. In general, we can divide the changes into three categories: bug fixes from ECMAScript 5, significant additions to the language, and Syntactic Sugar—changes intended to make the language more readable.

Not all browsers have made themselves compatible with ECMAScript 6 yet, or to be more precise, they don’t run JavaScript according to the new standard. As time passes the various browsers update themselves and support for the standard increases. Currently, not all browsers equally support the latest standard. You can view browser support and Node.js version support according to features here.

Working with and supporting ECMAScript 6 is becoming more and more relevant as time passes, and also thanks to new compilers. This is particularly true for Node.js programmers who can determine their environment, but also for programmers in the browser environment. So the time has come to learn all the features of ECMAScript in an orderly fashion. In this article and in the coming articles of this series, we cover all the new features of ECMAScript 6, one at a time, and with examples. We’ll assume that you know basic JavaScript and how to handle working with objects.

Development Environment

In general we’re looking at a JavaScript work environment. We can work in Node.js or in a browser environment, with each having its strong points.

Node.js based working/learning environment

If you’re a back-end developer who knows Node.js, you’re welcome to upgrade your Node.js version to the lasted one. We’ll be using version 6 here, which is the current version at the time of this article’s publication. Keep in mind that if there’s a newer version it would be better to use it since we can assume it would have the best support for ECMAScript 6. To verify which version you’re running open the console (linux or windows) and run:

node -v

To update Node.js to the latest version, go to the Node.js site and get the update for your platform (windows, mac, or linux).

It’s best to write all the example in a .js file (for example es6.js) and run by way of:

node es6.js

Take a look at the result and don’t forget to print it out to the console.log if need be.

Browser based working/learning environment

If you’re a front-end developer who’s not well versed in Node.js, you can write the examples in a file and save it in a local server if you have one, or on the computer. If you save the file on the computer it’s important to make sure that:

• You open it with the right browser, since not all browsers and versions support ECMAScript 6 yet in the same way
• The browser can run JavaScript locally without issue. You may need to tweak the browser setting in order to allow this.

You can also use an online service like JSFiddle or CodePen. With these as well, when you run the code and check the results, don’t forget to verify that the browser that you’re using supports the features that you’re working with. Again, the site to check which features are supported by which browser can be found here.

In the coming articles in this series we’ll cover and demonstrate one feature after another, to help you build a solid understanding of ECMAScript 6.

About the author: Ran Bar-Zik is an experienced web developer whose personal blog, Internet Israel, features articles and guides on Node.js, MongoDB, Git, SASS, jQuery, HTML 5, MySQL, and more. Translation of the original article by Aaron Raizen.