Why I prefer TypeScript over JavaScript? Here is why you should learn TypeScript.

TypeScript and JavaScript are both programming languages that have been widely used in web development in the past few years. While JavaScript has been the mainstay of web development for many years, TypeScript has been gaining popularity among developers in recent years. In this article, we’ll explore why TypeScript is preferred over JavaScript, and we’ll also compare the two languages using code snippets.

1. Type Safety

One of the main reasons why TypeScript is preferred over JavaScript is its strong typing feature. By allowing developers to define types for variables and function arguments, it helps detect errors in your codebase and make the code more maintainable. For example, let’s consider the following code snippet in JavaScript:

function add(a, b) {
    return a + b;
}

console.log(add("2", 3));

In the above code snippet, we’re trying to add a string to a number, which will result in a string concatenation instead of addition. This can cause unexpected results and errors in our code. However, if we use TypeScript, we can define types for the variables ‘a’ and ‘b’ as ‘number’. In this case, TypeScript will throw an error early on making the code more reliable. An example has been shown below.

function add(a: number, b: number): number {
    return a + b;
}

console.log(add("2", 3)); // This will throw an error at compile-time

2. Code Readability.

With the added features like type checking and optional type annotations, TypeScript can also make our code more readable as it makes it easier to understand the types and interfaces used in the code. Consider the following code snippet in JavaScript:

function printName(person) {
    console.log("My name is " + person.name);
}

let person = { name: "John", age: 30 };

printName(person);

In this code snippet, we’re passing an object to the function printName, which has a name property. However, it's not immediately clear from the code what the structure of the object should be. In TypeScript, we can define an interface for the object. An interface is a typing feature in TypeScript that allows us to describe the objects we will use in our code, ultimately allowing us to define the syntax for classes to follow. Compare the JavaScript code snippet above to the TypeScript code example below.

interface Person {
    name: string;
    age: number;
}

function printName(person: Person) {
    console.log("My name is " + person.name);
}

let person = { name: "John", age: 30 };
printName(person);

We have defined the interface ‘Person’, which specifies that the object should have a ‘name’ property of the type ‘string’ and an ‘age’ property of the type ‘number’. This predefines the structure of the code making it more readable and maintainable.

Last but not least of the primary benefits of TypeScript is better IDE support. Every developer will experience errors with the potential of deterring project progress. However, additional features in TypeScript including auto-completion, error checking, type checking will make it easier to catch errors and easily navigate the codebase.