HOW WILL TYPESCRIPT MAKE YOUR LIFE EASIER?

As a novice programmer, after a long time of working with Java, I got an opportunity to return to my roots (which was JavaScript for me). A few months ago, an applicable syntax and rules in JavaScript seemed to be intuitive and understandable. Then I missed some functionalities and facilities that would make life easier for programmers. Fortunately, since that time, I have been working using TypeScript at Code Poets. In this post, I would like to introduce TypeScript, which is a separate programming language heavily based on JavaScript. After reading this article, you should understand the differences between JavaScript and TypeScript.

If you are not sure you want to go through this article — I’m trying to convince you that TypeScript is awesome, and here is why in a nutshell:

What is TypeScript?

It’s a superset of JavaScript, created by Microsoft in 2012, that introduced additional functionalities and facilities. The creators of TypeScript needed a tool that would fix JavaScript’s weaknesses. They thought that JavaScript was not suited for writing larger applications. They noticed emerging problems related to scalability and maintenance of such programs and decided to create a new tool with functionalities missing from JavaScript.

Did they succeed? I think so. As proof, I would like to highlight the fact that TypeScript is the language in which people from Google wrote Angular 2. The fact that Google decided to use a tool built by one of its biggest competitors means that it must have some merit.

Static Typing

What did I miss in JavaScript compared to Java? Above all, static typing. Obviously, JavaScript’s syntax is more concise than Java syntax. It hides a lot of information that is desirable from a programmer’s point of view.

Let’s be honest and answer one question. How many times we’ve been writing code in JavaScript and wasting our time looking for information contained in our variable? This question implies the second answer. How would the possession of information about the type at the start affect our efficiency? Easier code inspection, debugging, and saving time while investigating bugs. That’s what TypeScript will provide you with static typing. Easier work with the code from programmer’s point of view is fundamental. But TypeScript gives us something more. Thanks to static typing, our IDE gains a much wider array of possibilities of static code analysis. Priceless help in a programmer’s work are also IDE hints, which significantly improve work speed and efficiency.

Type Inference

Everything sounds good so far, right? Static typing makes life easier but is not enough to change our habits. What else can TypeScript give us? Many JavaScript programmers find declaring a type for every variable and parameter to be very tedious, and they dislike languages such as Java because of it. TypeScript is a kind of a compromise between the complete lack of static typing and the verbose syntax of statically typed languages.

TypeScript’s syntax doesn’t require a type in literally every location, thanks to typing inference. Type inference provides us the possibility in which we don’t have to define the types: variables initialization, setting default parameter values, or determining the type returned by the function. In the above cases, type declaration is just not necessary, because the compiler can simply determine what type exists in a given place.

Constructors

Compared to JavaScript, the existence of constructors inside the classes is really natural, which is known to novice programmers. JavaScript constructors have a syntax and a purpose pretty different from Java’s. Additionally, in JavaScript, methods must be added to the prototype chain and not the class directly. Using prototypes is difficult to understand, but the object-oriented approach in TypeScript is more natural and understandable.

JavaScript constructor serving to create new Car object:

                function Car(brand, color) {
  this.age = 0;
  this.brand = brand;
  this.color = color;
}

Car.prototype.print = function print() {
  console.log(this.brand + ' color ' + this.color);
}

              

TypeScript constructor inside the class:

                class Car {
  private age: number;
  private brand: string;
  private color: string;

  constructor(age: number, brand: string, color: string) {
    this.age = age;
    this.brand = brand;
    this.color = color;
  }

  print() {
    console.log(this.brand + ' color ' + this.color);
  }
}

              

No Problems Reading Other Statically Typed Languages

Many companies abandon the distinction between frontend and backend developers. As a result, the teams are more flexible, because every team member can work on every part of the application. Similarities between TypeScript and programming languages such as Java/C++ make a programmer’s work easier, because switching between it and them is less painful than between it and JavaScript.

Conclusion

To sum it up, from my point of view, TypeScript enhances JavaScript with facilities from other programming languages, which makes it easier to use the structures and syntax of other languages.

With static typing, the code becomes clearer, while being safer for refactor (IDE support).

And finally, who of us, the frontend developers, would not get rid of the command console.log() to see what our variable contains?