JavaScript isn't easy. You have to learn how promises work, deal with the asynchronous behavior of the language and if you are a javascript developer, chances are you've faced some unpredictable behavior during runtime.
In my quest to try and write better code without changing my stack, I decided to give TypeScript a shot and here is what I have learned.
1. Statically typed languages have their perks:
When I started writing JS I had a Java background and I was amazed at how fast it is to write code without specifying the type of everything. However, as I started writing more complex code with JavaScript, I soon realized that this development speed comes with a price, much more errors happen during runtime instead of compile time. TypeScript on the other hand gives you very descriptive error messages at compile time with suggestions to fix those errors. This reduces the number of errors that you would otherwise face during runtime.
2. Development with statically typed languages is slower than untyped languages:
TS compiles to JS but since it is statically typed, it gives errors on statements that would normally run on JS. Often you need to spend more time fixing these errors than you would normally spend writing JS. For example, if you have a user object that has a username property you cannot declare it as an object type because object has no attribute username.
let user: object = getSomeUser();
/* The line below would give an error since type "object" has no attribute username */
let username: string = user.username;
Instead you can either declare it as type "any" or implement an interface for the user object and use it as the variable type.
// using interfaces
interface User {
username: string
}
let user: User = getSomeUser();
let username: string = user.username;
// using type any
let user: any = getSomeUser();
let username: string = user.username;
3. You don't need babel anymore:
If you're like most JavaScript developers, you use new ES6 syntax like arrow functions and import statements because let's face it, they make development easier. However, those features are not yet supported by browsers and thus we need babel to make them work. Since TypeScript compiles to JavaScript, it takes care of that for you. ES6 is automatically translated to JS that the browser understands which means you don't need to use babel anymore.
4. In TypeScript, some libraries are more equal than others:
Typescript requires libraries to have types. this means you need to download the types package of a library in addition to the library itself to be able to use it in TypeScript (see https://github.com/DefinitelyTyped for more information) . Some libraries however don't have types implemented which means you'll either need to use JavaScript for those libraries or implement what's called a declaration file for the library yourself. For example, sequelize migrations is not ready to be used with typescript and to use it, I had to use the JavaScript version. This is possible since TS is compiled to JS and thus understands JS.
5. You can write more reusable code using TypeScript than JavaScript:
Typescript is object oriented which means that the code you write is much more reusable compared to that written in JavaScript. This also means that the code will often be more readable and cleaner than JS.
6. It's not hard transitioning from JS to TS:
TS is made with JS developers in mind. You can progressively move to using TypeScript from JavaScript by making the configurations of TypeScript stricter as you learn more about TypeScript. In fact, you can progressively migrate old JavaScript projects to TypeScript by incrementally making the compiler more strict as you go through the tsconfig.json file.
To sum up, both JavaScript and TypeScript are good but each has an edge. If you're going for development speed then you should probably go for JavaScript, however, expect to spend more time debugging. But if you're creating a long-term project that will be maintained for long, then you should probably start using TypeScript but be prepared to give up some development speed for code reusability and better error messages. To learn more about TypeScript I recommend reading TypeScript Deep Dive.
If you have any tips or recommendations regarding the topic, kindly leave them in the comment :)
Check my other articles at gohary.io
Top comments (4)
I really like using TS in angular, but I found using it in react to be a bit jarring. Still, I've been meaning to get back to using it outside of angular
I think that makes sense because Angular has most features pre implemented out of the box but React on the other hand is more modular and you need many external node modules to implement a basic app
Not really what I was referring to. I was more thinking of the implementation of types, models, interfaces. Especially with core React and not libraries. It just doesn't quite flow for me, TS in React
I haven't used React with TS before but I think I should try that to understand why core React is not as TS ready as Angular.