Advantages and Disadvantages of Using TypeScript
TL;DR: Disadvantages are not big at all, TypeScript is the power buff under your sleeves
TypeScript, as a superset of JavaScript has the rising popularity over the years. It started as a nice to have but nowadays it has become more of a necessity in professional projects.
So you are considering learning it or start using it in your projects whether it is a small side project or a professional one, and want to know about its advantages and disadvantages or whether it’s a good investment in time and effort. Today we will be focusing on this.
Small history: TypeScript was first released back in 2012 by Microsoft as a language that compiles JavaScript. And it aimed to fix maybe the biggest complaining point of JavaScript users: static types, and type safety.
In its earlier days, it was mostly associated with Angular as Angular comes with TypeScript by default. But as the amount of Angular usage increased, TypeScript exposed more and more to the rest of the JavaScript community.
One thing to note here, whatever you write on TypeScript will also be a valid JavaScript code. It will point out a lot of the mistakes you may encounter on production, as you code and develop your project.
We can talk about the advantages and disadvantages of TypeScript in these small points:
TypeScript enables static typing, accurately defining the type of a variable
Even though the name ‘static typing’ should give you enough information about what it is, it may sound confusing to someone as a concept if they are not familiar or never thought about it.
In JavaScript, you don’t need to define the type of a variable. It will generically understand the type of variable you defined. If you don’t assign a value its type will be undefined.
JavaScript has 6 built-in types:
Number, String, Boolean, Symbol, Null, Undefined, BigInt
You can define much more than this with TypeScript.
JavaScript is a dynamically typed language, with dynamic types. And the variables in JavaScript are not associated with any particular value type, and can be assigned values of all types. JavaScript is also a weekly typed language, which means it allows implicit type conversion when an operation involves mismatched types, instead of throwing an error. — MDN
So for the examples above, if we were using TypeScript, you would get an error. Here in these examples, it’s obvious why but if you were working on a big project you would not notice why you are getting that error.
Here you can see just by hovering over variables one, two, and three. For the first two variables, the types are defined and TypeScript shows a warning that if you want to change the value of the variable, use the correct type.
As a last note on this, TypeScript has the type ‘any’ if you are not sure or want to bypass this type check for some reason.
TypeScript grants the developer the power of intelligence
In my opinion, this is one of the underrated advantages of TypeScript. You won’t know that you have this power if you only used TypeScript and you realize what you are missing if you stop using it after you go back to Vanilla JavaScript. Intellisense helps with code completion and hints with the code.
Below Stackblitz projects have the same cars object which is exported from a separate file. In the index.js and index.ts files, ‘cars’ objects are imported and can be used. On the Vanilla JavaScript project, if you try to complete the 6th line, you will not get the properties sedan and hatchback. But in the TypeScript project, you will instantly know what is in the cars object.
const displayedCard = cars.sedan.brand
And as for disadvantages, if you have never used a type-safe language before, the concept of types takes some time to get used to. Even if it’s not steep, getting up to speed with TypeScript takes some time.
Also, TypeScript needs to compile to JavaScript so you can’t just open a notepad file and save it as a js file and expect it to work right away. TypeScript adds a build step whether it’s Webpack, Babel, or others, it is a required step and there is no other way to prevent it. But if you are using a framework or a library like React, you are going to do it anyway so this may not be counted as a disadvantage.
Aside from these two, TypeScript creates an illusion that your application is error-prone because you are checking all the types in the application, and every variable, request, and response is type-safe.
In reality, it is not. At the end of the day, TS compiles to JS. And the build you are deploying to production will not have any of these types. TS just does a type check on the development stage. After that point, you will be dealing with Vanilla JavaScript. You may still encounter some bugs in the production but those will be far less than if you didn’t use TypeScript. You can also reduce those bugs/errors too with unit testing.
Thank you for reading. For more articles follow me on Twitter & Medium