Languages opinion - part three - Javascript and Typescript
This post is part of the Languages Opinion series.
Welcome back to my mini-series about programming languages. In this post, we will talk about what is probably the world’s most used programming language: JavaScript. We will also discuss TypeScript, given its relevance and usage today.
JavaScript history Link to heading
JavaScript was famously invented in 1995 in 10 days, for inclusion in Netscape. Over the decades, it has been adopted by every browser and used by (more or less) every website. Eventually, with the creation of node.js, it found a place server-side as well. JavaScript interpreters, such as Spider Monkey from Mozilla, or v8 from Google, were also embedded in various applications. I worked in the early 2010s in a large C++ project, where we embedded Spider Monkey to implement some customizations for our customers, and it was a very interesting project!
Nowadays JavaScript is everywhere - from desktop applications built with Electron to smart tvs - and of course smartphones. It is probably the most used programming language in the world, and it was key in inventing JSON, which is even more ubiquitous.
In the 2010s, it went through an explosive growth phase, but it also reached maturity and a lot of new interesting features with the release of ECMAScript 6, often called “ES6”. This new version of JavaScript gave the language a very modern feeling, and fixed some of its pain points. There are a lot of lists of “what’s new in ES6” around, so I won’t bother repeating everything, but as a quick summary we’ve got:
let
andconst
- arrow functions
- spread operators
Map
andSet
- classes
- promises
It was a huge release of the language, and writing modern JS is much better than it was a decade ago. It is actually a fun language now! 😊
Tooling and frameworks Link to heading
Since web developers had to live for years with Internet Explorer - whose development stopped ages ago -, for a long time people used “transpilers” like babel to write modern JS as input and get the old syntax as output. In this way, your output code could work even in older browsers. Luckily, IE is finally gone 🎉, and since the vast majority of browsers now support modern JavaScript natively, this is a lot less necessary than it used to be!
Furthermore, the huge increase in the amount of JavaScript written in a typical website led to the rise of minifiers and bundlers, such as webpack. This has been a complication for beginners, as you used to write an html page by hand and some <script src>
tags, where now you have to use a complex build pipeline. Luckily, there was a rise of many amazing frameworks, that included all that setup for you.
Speaking of web frameworks, there have been a ton. JQuery was immensely popular, but it wasn’t really a framework - more of a library. Backbone was one of the most used early frameworks, but I have a special place in my heart for AngularJS, which I believe helped popularize the concept of “components as custom tags” and unit testing on the frontend.
Then, of course, came React - today’s de-facto standard, and one which relies a lot on modern tooling and syntax. There are of course a ton of valid alternatives, like Angular - which is pretty good in my opinion, and widely used in the enterprise -, and Vue. However, React is so popular that there are frameworks built on top of it - for example, NextJS.
If I think back on how we wrote web applications in 2010, and how we write them today… well, it has surely changed a lot (for the better)! 😅
TypeScript Link to heading
Speaking of tools, TypeScript is surely one of the most popular. It is a new open-source language, built as a superset of JavaScript (meaning that most JavaScript is also valid TypeScript). The main feature it adds is typing - you can specify the type of variables, functions, and so on and TS will check for you that you have used them coherently. Given that JS is a weakly-typed language, with many automated conversions, a mistake with types in JS often causes silent erroneous behaviors and bugs, which you have to investigate at runtime. Adding static typing helps a lot with these errors - and can help your editor give you much better suggestions!
I find the type system of TypeScript very interesting, since it is quite powerful: it has nullability, supports union and intersection types, narrowing, and even has types such as Partial
or Pick
.
It was built by Microsoft and was released initially in 2012. Today, it is extremely popular - by some surveys, more than JavaScript itself! Many people have found the static types to be particularly helpful, and would not go back to writing “classic” JavaScript.
Since TS is built as a superset of JS, it means that it adopts all its modern features, such as classes or arrow functions. It also can be used very easily with other JS libraries. It includes a transpiler, that takes in input .ts
and produces .js
files, stripping the types’ annotations while checking for types coherence.
Here is a quick example of the type annotations in play:
// Parameter type annotation
function greet(name: string) {
console.log("Hello, " + name.toUpperCase());
}
// In JS, this would be a runtime error if executed!
greet(42);
// TypeScript however gives us an error at compile time:
// Argument of type 'number' is not assignable to parameter of type 'string'.
My personal opinion Link to heading
If I had to start a new project today, I would use React as a web framework for the frontend part. Using Node on the backend is also pretty popular and a valid possibility, even if I feel its popularity has waned a bit in the past 3-5 years.
I also find TypeScript to be a great language. It makes web programmers a lot more productive, both by preventing bugs and by giving you fantastic suggestions and refactoring tools in your editor or IDE, up to the standard of Java. Not only I wouldn’t write raw JavaScript in a new project today, but I would even recommend starting to convert old code to TypeScript, if you still aren’t using it. It is pretty easy to introduce in an existing project, in my experience, and the benefits are great.