Jurrien Piris

Full-stack developer

TypeScript vs ECMAScript 2018

Let me start with saying that both of these languages are amazing and powerful. JavaScript being around since 1995 by Netscape to make HTML dynamic. Inspired by Python and Lua and being an inspiration for ActionScript and CoffeeScript, it's one of widely used programming languages these day. On the other hand, TypeScript being around since 2012 and created by Microsoft, TypeScript is a strict superset of JavaScript. I see this as modern aged JavaScript development. It's a statically compiled language to write clean and simple JavaScript code. It is possible to run this on Node.js or browsers which supports ECMAScript 3 or any newer version.

ECMAScript 2018

Back in the days, JavaScript was just a weak typed scripting language to create these dynamic HTML pages. Since the web being involved, simple hompages are now being replaced by proper designed webapplications. However JavaScript wasn't originally designed for this. Adjustments had to be made and with ECMAScript 2018 being released, we can say thia ECMAScript 2018 is a real beast right now! ECMA is an organization that develops international standards and is responsible for standardizing JavaScript

Today, all major browsers do support ECMAScript 5. So whenever someone says JavaScript (without any further specification), they actually mean ECMAScript 5. The 6th edition called ES6 or ES2015 was released in 2015 and in 2016 the 7th edition called ES7 or ES2016 was released. So there is a gap between the latest official version of the JavaScript language and what browsers are capable to understand. To fill up this gap, we use compilers to compile our ECMAScript 2018 to ES5 code. We write our beautiful ECMAScript 2018 code and the compiler will translate and compile the code to plain ES5 code so all the major browsers will be able to execute our code. See a example below.

Babel compiler GIF

One of these popular compilers is Babel or Babel.js. It's a free and open-source JavaScript compiler and configurable transpiler used in web development. The core version of Babel is downloaded over 5 million times a month!

Compiler vs. Transpiler

There is some confusion about the difference between a compiler and a transpiler. A compiler takes your code and turns it into something very different, a whole new language. A good example is with a high level language such as C# or Visual Basic. When you write code and build it, the compiler (either csc.exe [C# compiler] or vbc.exe [Visual Basic compiler] in this case) takes your code and turns it into Intermediate Language (IL). Example C# code; A transpiler takes your code and changes it. But it’s still in the same language that you started out with. TypeScript is JavaScript, infact, TypeScript is a subset of JavaScript. When the TypeScript compiler runs over your code, it reads in TypeScript (which is JavaScript) and outputs JavaScript.

TypeScript

A static type system can help prevent many potential runtime errors, especially as applications grow. This is one of the main reasons why TypeScript has born. The reason for TypeScript's existence is to have a compiler and language which can enforce types better than plain or vanilla JavaScript does. Any regular JavaScript is valid TypeScript, syntactically. That doesn't mean that the compiler is always happy with it. Plain JavaScript often contains code which is problematic, for example in terms of type security. That doesn't make it invalid TypeScript code, but this is exactly the reason why TypeScript exists and it's exactly the compiler's job to point out those problems to you. This does mean that the TypeScript code does compile and produces JavaScript as output.

Conclusion

If we compare both Typescript vs ES6, in my opinion TypeScript is having more advantages when comparing to ECMAScript 2019. Another major advantage of the TypeScript is it will run a quick sanity test of all JavaScript files to identify syntax errors. This means that we can easily migrate JavaScript to TypeScript.