ECMAScript vs JavaScript vs TypeScript

While you’re reading about JavaScript and TypeScript online, you might come across references to some mystical third language — ECMAScript. Think of terms like ES6 or ES2016. ECMAScript is a specification that defines the language features of JavaScript, and therefore TypeScript. Let’s delve into the details.

JavaScript.

So if you’re here you probably already know what JavaScript is, but just in case let’s go through it. JavaScript is a high-level weakly-typed programming language, originally just used for building dynamic web pages, but now becoming increasingly common for general programming and back-end servers. It’s powering 98.8% of websites, so it’s quite popular.

ECMAScript.

ECMAScript is the standard that JavaScript implements. JavaScript did previously have a few siblings that also implemented ECMAScript, like ActionScript and JScript, but JavaScript is pretty much the only one that survived, which is why you’ll see JavaScript and ECMAScript used pretty interchangeably. The name comes from Ecma International, a nonprofit standards organisation for ICT.

ECMAScript defines the language features and syntax, but not things like I/O.

Things ECMAScript does define:

• Array methods
• Syntax
• Operators

Things ECMAScript doesn’t define:

• File system handling
• DOM manipulation
• Networking
• Graphics

Since 2015, a new major version of ECMAScript has been published every June. This starts with ECMAScript 2015, or ES2015. You might also see it referred to as ES6, since it’s the 6th major edition of ECMAScript.

You’ll see ES6 mentioned a lot online as it was a significant improvement, adding features like the “let” and “const” keywords, arrow functions, maps and sets, and many more.

So every year a new ECMAScript edition is approved and published by the ECMA General Assembly. Before ES6 there was a new specification more sporadically, every few years. They were referred to by edition, e.g. ES4 or ES5. Following ES6 each version is referred to by the year it was published, e.g. ES6 is ES2015. There’s also ESNext, which refers to whatever the next version is.

ECMAScript features have to go through a 4 stage application process:

• Stage 0 is a new proposal
• Stage 1 is a proposal under consideration
• Stage 2 is where a solution/design gets drafted for a proposal
• Stage 3 is where a proposal feature has been tested, and is recommended to be implemented. There’s not likely to be any major changes, but there may still be some minor changes from feedback
• Stage 4 is the final stage, and means a feature is complete and ready to be included in the standard

This is all public, by the way. You can follow along with ECMAScript proposals and meeting notes here if you want to take a look at new potential JavaScript features.

TypeScript.

TypeScript is a programming language developed by Microsoft to add static typing, and optional type annotations to JavaScript. It’s a superset of JavaScript, meaning all JavaScript is valid TypeScript, but not all TypeScript is valid JavaScript.

//Valid JavaScript, and valid TypeScript but it will complain about the lack of types
function add(a, b) {
    return a + b;
}
//Valid TypeScript with types, now invalid JavaScript
function add(a: number, b: number): number {
    return a + b;
}

Conclusion.

So to sum everything up:

JavaScript is based on a standard called ECMAScript. Technically JavaScript isn’t ECMAScript, but it’s the only version of it that still matters.

ECMAScript decides the baseline features JavaScript implements.

TypeScript is a superset of JavaScript that adds static typing and type annotations to JavaScript.

That’s everything! Thanks for reading — if you liked this article, feel free to share this article, or follow me on Twitter.

Originally published at https://www.omarileon.me on March 5, 2024.