JavaScript was quite reliable when we had few developers in-house and were focused on small projects. Each programmer knew what a line of code meant. But, as Bhoos' codebase and the workforce grew, JavaScript became unmanageable, and a lot of unexpected bugs started to occur involving NaN, property not found in undefined, and many more.
What is TypeScript?
TypeScript was designed and developed by Microsoft. Built on JavaScript, TypeScript is a superset of JavaScript and is a strongly typed language. Therefore, if you thoroughly understand JavaScript, you can grasp TypeScript. With TypeScript, you can accomplish anything that JavaScript can. Already a victory!
In a nutshell, TypeScript is just JavaScript with types.
In JavaScript one cannot assign types, and we became pretty comfortable without it. However, as we grew, it was hard for new colleagues and even interns to decode what a line of code meant. "Why is this code not taking a string?" was a constant dilemma.
Here are the reasons why we moved from JavaScript to TypeScript
Fewer Errors in Runtime:
Most JavaScript programmers are exhausted with runtime-type errors. Here, TypeScript plays a significant role. TypeScript variables need to be defined strictly, and also it compiles before it runs. Hence, when we started declaring types, it boosted our confidence by orders of magnitude that they would run without any error. Mostly because such errors were caught during the coding phase itself (with nifty tools like VSCode).
Say GoodBye to such errors with TypeScript.
Fact: You will have fewer surprising moments when viewing runtime errors.
Easy to Write and Maintain:
When you are working in a codebase with different people in JavaScript, the other people might execute and take forever to understand why a certain code does not work. Similarly, you might get lost when you return to a project after several weeks in Javascript. TypeScript has a "type" feature; every line that is written has a meaning, making it easier to read and understand. It saves an organization's time and effort.
Abstraction can easily be expressed in Typescript. You can use the abstract keyword to define an abstract class that contains one or more abstract methods.
In JavaScript, there is no concept of abstract classes or abstract methods. However, you can achieve a similar effect by using inheritance and the prototype property of objects. Abstract classes and similar features are used by experienced developers and it is much easier to implement in TypeScript than JavaScript, thus TS>JS as you improve as a developer.
Fact: 39% of JavaScript developers hate JavaScript, according to the 2021 Stack Overflow survey.
Static Typing:
The variables are dynamically typed in JavaScript. This indicates that the type of the variable is determined at runtime based on the value it is set to. But, in TypeScript you are required to declare the type of a variable, similar to how you would in C++ or Java. This might seem time-consuming, but it will save you time while finding any typecast-related mistakes as you write the code.
Additionally, it can protect you against irksome bugs that might arise if you use JavaScript and its dynamically typed variables.
While this may look quite obvious, when you pass values to function which pass that value to another function, you quickly lose track of **simple** things like these which lead to a lot of debugging down the line.
Can I use dynamic typing using TypeScript though?
As mentioned above, TypeScript is a superset of JavaScript.
This defines a dictionary that takes any string as key and will take a string as its value. The only problem is that when you try to access the keys, you don’t know whether that particular dictionary has that key or not.
Or when all hope is lost, you can simply use the “any” type.
Having said that, try to avoid using any type. Because using any might be a quick fix, but you will roll down back to JavaScript.
Fact: TypeScript is definitely a strict language, but it’s worth your time.
TypeScript Generics:
TypeScript generics provide a way to create reusable components that work with a variety of types. By using generics, you can write code that can work with a variety of types, rather than being tied to a specific type. This can make your code more flexible and easier to reuse in different contexts. Generics make code easier to read and understand, because it separates the essential logic and the minimal constraints required in types from the rest of the application code.
In other terms, Generics are to Types, what Types are to Variables.
To Scale Big Projects:
With dynamic typing and a very flexible structure, JavaScript is definitely a comfortable language. But, in an organization where different people are working on the same codebase, it is tough to understand and scale the products.
Hence, when it comes to implementing large-scale applications, TypeScript is a powerful type system where one can create types from other types. Moreover, it has excellent tooling support, including code completion, refactoring, and debugging support in many popular code editors.
Fact: Even Slack uses TypeScript
Popular and Active:
These days, TypeScript is supported by several frameworks, including React, Angular, NestJS, and VueJS. Even Angular uses TypeScript as its core language. With additional capabilities and support for ECMAScript, TypeScript is JavaScript. Every JavaScript framework has configuration options for using TypeScript. It is supported by frameworks to develop higher quality code because of its statically typed and simple code detecting feature. With TypeScript, many concepts are simple to implement, which is one reason to prefer it to JavaScript.
Fact: You will find a large community which will help you move ahead when you get stuck in TypeScript.
Interchangeable:
You can utilize all JavaScript code and libraries in your TypeScript code because JavaScript is a subset of TypeScript, though you might NOT want to do this. You can verify this by the fact that a JavaScript file saved with the.ts extension (for TypeScript) functions flawlessly. Although every line of code written in TypeScript is a JavaScript code, not every TypeScript code is a JavaScript code. Being interchangeable allows you to incorporate TypeScript into your JavaScript codebase. Just an addition of types to every module is needed in a JavaScript file to make a TypeScript file.
How to Change your Code from JS to TS?
Start small, add some typing to some of your code and use `"strict": false,` in the tsconfig.json of your project. And once you feel comfortable enough, set the strict flag to true.
Additionally, for code that you know has correct typing in that particular use case, you also might feel comfortable using @ts-ignore flag to disable type checking in the next line.
To sum up, you might want to stick to JavaScript if you don't anticipate your codebase expanding beyond a few hundred lines of code, as TypeScript may be a bit overkilling. On the other hand, you should begin using TypeScript right away if you intend to develop multiple features or handle a lot of data.