Is it worth to use Typescript in 2021?

2021-05-037 min

Long story short

Answering the main question of this article - Yes! It is worth because Typescript gives us many benefits which we cannot receive from vanilla js. We have types, safety, auto imports, self-documented code, and a lot more.

Interested you?

Let's break it into few topics.

What is Typescript?

Typescript documentation says:

TypeScript is an open-source language which builds on JavaScript, one of the world’s most used tools, by adding static type definitions.

To expand this quotation - Typescript is an open-source programming language created by Microsoft. It's a superset of Javascript which introduces static typing.

The great thing about Typescript is that in the end it's compiled to Javascript, so you can use it everywhere when you would use JS (Javascript).

Another great advantage is that TS (Typescript) is compatible with Javascript, so in case of need you can use both together in the same project.

Why do we need a Typescript?

It's worth noticing that having types is way better than not having them because with properly typed application we know everything even before we run the code. Besides that Typescript notify us about all errors it finds even before you run the application, so we can easily fix all of our mistakes right away.

Remember that we are just humans, so we make mistakes, even if we try hard. So if we use vanilla js, we can not be aware of the data type. We can be tired, unfocused, we can work in rush... Actually, there might be many reasons to make a mistake.

As an example let's consider the following function:

const add = (a, b) => a + b

Looks obvious, right? What can goes wrong?

Ok, so now we can use it by passing two arguments, but one is a number, and the second just looks like a number, but it's a string.

add(1, '2') // output is "12"

Zrzut ekranu 2021-05-2 o 22.23.49.png

Output is "12". Surprised?

The case is that we expected a sum of two numbers (1 + 2 = 3), instead, we received string with content "12" because of how JS works. Now you can imagine, that you make a similar mistake with a financial application where this kind of mistake could cost a lot of money. It's getting serious, isn't it?

So how we can prevent these mistakes?

Here is the same function but made with Typescript

const add = (a: number, b: number) => a + b

And this time if we would try to call it the same way as previously

add(1, '2')

Typescript will throw an error notifying us about wrong types - Type 'string' is not assignable to type 'number'

Zrzut ekranu 2021-05-3 o 11.27.28.png

Ok, I think it was interesting and gives us some arguments to use TS, but maybe it's not enough to convince you? Give me another chance and follow this article.

Advantages of using Typescript

Self documented code

Typescript code is self-explanatory. You don't need to run the project to see what kind of data do you have to play with. All that you need is in front of you, in your code editor. You just need to open the project and read :)

And actually, It's funny because working with Typescript I am writing a lot of code without running it... And this is because of known types :) I just know what can I expect, and it's really beautiful.

On the other hand few times, I had a chance to join the vanilla JS project and you know what? I felt blind... really. To know the data I needed to read functions really carefully and often it was not enough to deduce the type, so then I needed to run a js script and use a debugger or some console logs eventually to understand what I'm dealing with.

With Typescript it's another story. All is clear, all is typed (if you use it properly). What you need to do is just read the defined type or hover over the variable name to see the type.

Zrzut ekranu 2021-05-3 o 11.30.00.png

Typescript has great IDE support

If you are reading it I assume that most probably you are a developer or at least a person who knows the topic at some point, so you probably know how much time we as programmers spent with our IDE (integrated development environment) e.g. VSC.

Why Typescript is so great for our IDE?

  • It gives us mouse hover support: By hovering over the variable we can see its type.
  • It supports auto-completion, so writing the code is faster, easier, and more reliable.
  • It supports auto-imports, so writing function/variable name which is out of the current file, IDE gives us an option to auto-import that variable from proper resources.
  • It gives us real-time types checking, so you are immediately notified about anything wrong with your types.

Typescript can deduce types for you

It simply means that typescript can “figure out” a type of the variable value without the need of adding additional annotations. Let's take a look at the example below.

Zrzut ekranu 2021-05-3 o 11.34.37.png

Zrzut ekranu 2021-05-3 o 11.34.48.png

As you can see I did not tell Typescript that the output will be a string, TS deduces it itself based on the function body.

Summary

I think all I wrote for you show a lot of Typescript advantages. Of course, there might be also some disadvantages like - You need to learn it :) And probably in the very beginning you could feel overwhelmed and lost... Maybe even Typescript will slow you down.

But remember - If you spend some time with this tool it gives you more reliability, stability, and safety. And in the end, working with a properly typed application save you a lot of time.

Good luck!