Why should you write in TypeScript?
It increases readability and maintainability
Typings are practically the best documentation you can have. You know how to use most of the functions by just looking at their type definition.
TypeScript will tell you about any errors it finds during compilation, for example, spelling mistakes and undeclared variables. It’s always better to notice errors during compilation, rather than during runtime. The full list of TypeScript compiler errors can be found on TypeScript GitHub Repository.
This script also enhances the functionalities provided by code editors and IDE (Integrated Development Environment), such as auto-completion, definition prompting, jump-to-definition, and refactoring.
It is very flexible
It is very forgiving because even though its transpiler detects errors in your .ts files, it will still transpile them into .js files. Having said that, you can disable this feature by modifying the “tsconfig.json” file in your project folder.
TypeScript compiler also allows you to transpile your .ts files into .js files in different ECMAScript target versions, from “ES3” to “ESNext”, providing the maximum amount of possible backward compatibility.
It has an active community
TypeScript also embraces ES6 standards and provides some support for ES7 drafting standards.
What are the disadvantages of TypeScript?
Everything has two sides. For example, code written in TypeScript can seem to be too cumbersome since type annotations need to be used everywhere in order to get the most out of TypeScript.
How to use TypeScript?
To use this script, you first need Node.js to be installed on your computer.
Then, open your command line tool and type the following command to install it.
Once it finished, you can run the following command to transpile your `.ts` files. In this example, we’re going to transpile our `hello_world.ts` file.
We’re going to write some TypeScript code to discover the power of TypeScript.
Let’s say we have the following data:
We can write an interface to assure the data structure. We know that a student should have a name of type string, 3 arrays of scores (type number) for homework, quizzes and tests respectively. The possible interface can resemble the following:
Once we created the interface “Student”, we can assign the student objects with this type.
Let’s say we create a new object called “mary” like this:
If you run the TypeScript compiler, an error message will appear.
The reason for this is that “mary” is of type “Student”, and we defined that a “Student” should have a name of type “string”, homework, quizzes, tests of type “number array”. However, in our “mary” object, it only has a name, which resulted in an error.
Now, we can start writing the functions. First, let’s write a function to calculate the average score of a number array.
In this case, however, the code block isn’t type-safe because we can pass in anything to the “scores” parameter, which will cause the function to break. We can add types to ensure that only a number array is passed in as the “scores” parameter and the function should return a number as follows:
If we try to pass in “lloyd.name” as the “scores” parameter, it will result in an error again.
The complete code is available on my GitLab Repository.
Article written by Siu Kei CHEUNG, CAWEB Master’s