Author: Codenga 21.02.2022

Everyone who is interested in the front-end sooner or later comes across the TypeScript language. There are different opinions about it, but there is no denying that it is an important and widespread technology.

So what is TypeScript? And is it worth to be interested in this language? Let's check it out!

What is TypeScript

The official definition is this: TypeScript is a superset of the JavaScript language. There's nothing complicated here. Imagine that TypeScript simply extends JavaScript with new capabilities.

"Pure" JS (that's what we'll conventionally call JavaScript) lacks many of the mechanisms that make it easy to create complex, front-end projects. And that's why TypeScript (TS) was invented. To get rid of these limitations, or at least mitigate them.

There are divided opinions about TS among front-end developers. Some love it while others hate it. It does not change the fact that TS is a very important part of the modern front-end.

How to use TypeScript

Let's start with the basic stuff - how to get started with TypeScript? Technically, the TS language is compiled (otherwise known as transpiled) into JS. Why? Because the environment in which you run the code "understands" the JS language, but does not understand TS.

So the TypeScript code needs to be converted to JavaScript code before running. The conversion itself is nothing difficult. It is a matter of using an appropriate tool. In practice, such tools are usually deeply integrated with the entire project "workflow" and the transpilation/conversion process itself runs automatically.

Where is TypeScript used?

We will answer this question in general terms - TS can be used wherever we used pure JavaScript so far. After the transpilation, the TS code is converted into JS code. And you can run it in a browser or in a Node.js environment.

TS offers mechanisms to help you work on complex projects. Of course you can also use it to write some simple scripts for the browser, but that's a bit pointless. In general, the more complex the project, the more you can benefit from using TS.

TypeScript was created by Microsoft. It was designed to facilitate the development of applications in a typical corporate environment. TS was quite quickly adopted not only by large companies (Slack, Airbnb) but also by various open-source projects (Angular, Vue).

What features does TS offer?

You already know that TS extends JS with new features. So now let's look at what TS has to offer.

The most important thing is static typing. This mechanism makes sure that the data type in the variable is already checked at the stage of transpiling TS to JS.

In JS you can declare a variable and assign data of any type to it: string, number, boolean etc. On one hand this provides flexibility but on the other it causes many problems.

We have this classic example:

function sum(x, y) {
    return x + y;
}
let result = sum("10", "5");
console.log(result);

The result is the string "105". The function should operate on numbers, but we've provided string arguments. Hence, the result is of string type - different than one would expect.

In TypeScript, you can approach the issue like this:

function sum(x: number, y: number) {
    return x + y;
}
let result = sum("10", "5");
console.log(result);

Here we specify that the arguments must be of type number. If we try to convert such code to JS then transpilation will be aborted and TS will return an error. This is one of those key features that are missing in pure JS. That is type checking before code execution.

Other features

TypeScript has other capabilities as well:

• Classes and Interfaces - this gives you the ability to write code in a style similar to that known from languages such as Java, C#, etc.
• Modules
• Enumeration types

Some of these mechanisms are also available in newer "pure" JS standards. This is a bit of a testament to the fact that over the years there have been quite a few shortcomings in the JS language that have finally been recognized.

Summary

Using TS instead of JS has its significant advantages: more predictable code, easier maintenance of a complex project, potential reduction of many bugs, etc.

On the other hand, TS introduces another layer of complexity:

• the necessity of mastering TypeScript mechanisms such as typing
• the necessity of using transpilation tools.

Usually, with more complex projects however, the advantages far outweigh the disadvantages. If you bind your future to the front-end then there will sometimes be simply no way out.

You may come across projects that are written in TS and in that situation there is nothing left to do but learn it properly. It is not really difficult. TS code is just a JS, enriched with new mechanisms. If you know the basics of JavaScript, mastering TS shouldn't be too difficult.