Receive New Tutorials

Introduction to ES6 with Jack Franklin – Codementor Office Hours Q&A

– {{showDate(postTime)}}

This article is based on the Codementor Office Hours – Introduction to ECMAScript 6, a special session hosted by Jack Franklin. During the Q & A time, Jack had the discussion of ES6 with audiences online. If you had read the series of Introduction to ES6 articles, do not miss this one.

When Will ES6 become Widespread?

I think this is the first release that I’ve ever been following along with where the tools like Traceur and things have sprung up very quickly and gained popularity very quickly and it shows that a lot of people are really excited about ES6 and the additions it has.

Most people working on big JavaScript apps now should absolutely be using ES6 through something like Traceur or Babel, particularly if you only have to support a newer set of browsers as you have less risk there.

There are so many different features across so many different browsers. I know Google Chrome has implemented a few ES6 features in stable or behind-a-flag versions. They’ve implemented a lot more in their canary version. Similarly I think Firefox is pretty up to date in trying to implement stuff, but there’s still a lot more missing.

I haven’t seen native ES6 module implementation yet. For example, I think Chrome behind-a-flag definitely supports arrow functions. It may even be in stable. This stuff moves so quickly that it’s very hard to keep up with it. However, ES6 modules are definitely not going to be implemented in a couple of months—it’ll probably be more like six or twelve months at least.

Nonetheless, the tools are really keeping up to date so you can certainly use this stuff through tools today. When it comes to ditching those tools and using it on your own natively, we’re still a fair way off from that. But very difficult to predict that kind of thing.

ES6 vs TypeScript

I confess to not having used TypeScript yet in a project, so if there’s anyone who knows TypeScript better than me, please feel free to correct me if I get stuff wrong. I believe that at the moment a part of what TypeScript provides is a lot of the ES6 features I believe. For example, if you write some TypeScript, you can use the arrow functions and it would convert that back into JavaScript when it compiles that stuff. The way I see it evolving is TypeScript will just stay around but add the things ES6 doesn’t cover, the most obvious ones being types and any kind of additions like that. I think they’re going to add annotations as well, and a few new things.

I think TypeScript will stay as that stuff, but then they won’t need to add all the extra features like arrow functions and whatnot because ES6 will just cover that for you. This certainly doesn’t mean the end of things like TypeScript at all. One of the biggest goals of ES6 was to make JavaScript better as a target language to compile into, as in they want to make JavaScript more friendly for people who want to build new languages like TypeScript, CoffeeScript and that kind of thing. It’s being encouraged that you should write your code (not in JavaScript) and have it converted into JavaScript so that whole breed of additions like TypeScript certainly isn’t going to go anywhere at all.

Starting a New Project

What would make you start a project dead set on using ES6?

The only thing would be what kind of browsers I needed to support.

Again, I don’t know this for sure because I’m quite fortunate that at work we get to target quite new browsers, and in all my side projects I never worry about browsers like IE6 for obvious reasons. But I think the thing to check there would be what level of browsers that things like Traceur and Babel support. For example, if they would support down to IE6, then you could use ES6 for all projects.

However, I don’t believe Traceur works in IE6, perhaps not even IE9, I think it might be only 10 and up. All in all, if you’re using Traceur or Babel, or even something like TypeScript or similar, the main problem is what browsers they support with their outputted code.

If I were starting a side project in JavaScript and I only cared about working in the newer version of browsers, I would absolutely use ES6 today without a doubt. A lot of the specs are confirmed, so you can write code now and know that the entire spec isn’t going to change and the syntax isn’t going to change. This gets you in a nice position where you’re kind of ahead of the curve a little bit.

The Debugging Workflow

Are there any special settings while developing with ES6?

All you need to do is – I believe this will happen by default – make sure you’re working with source maps. I’m pretty sure Traceur and Babel support them.

Personally, I debug all my stuff in Google Chrome and the consoles there are really good at resource maps. For example, if you’ve enabled source maps and you get an error, it will say something like “error line 42” but that actually maps line 20 of your actual code but you can click that and it will take you to the pre-compiled code.

Every now and then there is a problem where you might just have the error and it might point you in the wrong direction, but on the whole source maps gets you ninety-five percent of the way there.

Where to find the latest happenings of ES6

E.g. the progress standards and the roadmaps, things like that?

There’s ES Discuss, which is kind of a forum where a lot of the implementation details of ES6 are discussed in detail by the people leading it. But a lot of that is quite difficult to read. It’s very in-depth, so if you’re not too familiar with the spec, it’s quite difficult to follow.

The main blog I follow on is the blog by Doctor Axel Rauschmayer.

Axel is fantastic at keeping up to date with the spec and stuff. If you look at his ES6 content here, he’s got a ton of posts about the latest specification changes. Once the spec is confirmed he tends to write big posts about the specs. For example, this post is the go-to-guide for ES6 modules syntax. There are similar posts on this blog for all the other syntaxes, classes, generators and so on. So really, I would keep myself up to date about ES6 by following Doctor Axel on Twitter and subscribing to his blog, which is extremely in-depth, well-written, and easy to digest.

I guess another place would be my blog, javascriptplayground.com

I’ve written recently about promises, ES6 classes, ES6 destructuring, modules and dependencies with JSP and on SystemJS, arrow functions and more. It’s kind of a general Javacript blog but most of the content these days tends to be ES6-focused.

Will You Publish a Book on ES6?

Probably not on ES6 particularly. Actually, Doctor Axel behind the 2ality blog is currently writing a book on ES6 which is at exploringjs.com. I believe this will be free online, you can buy PDF and print versions. But this will be the go-to resource. I don’t really see any point in writing one myself because really he’ll cover absolutely everything so I really recommend checking this out as well. I’ll put the link in the chat for that.

About Jack Franklin

Jack Franklin is the author of the book Beginning jQuery. Jack was also asked by Addy Osmani to contribute to his Backbone Fundamentals book (the chapter on using Backbone and RequireJS specifically.) Jack runs the popular JavaScript Playground blog, on which he writes tutorials about a variety of JavaScript topics including ES6, GoldNote and more. He is currently a developer over at GoCardless and is a regular writer for DotNet, which is the largest web development magazine over in the UK. He wrote the JavaScript Gallery section for a number of months on JavaScript topics, including a recent cover feature on JavaScript libraries.