TypeScript lets you write JavaScript the way you really want to. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. TypeScript is pure object oriented with classes, interfaces and statically typed like C# or Java. The popular JavaScript framework Angular 2.0 is written in TypeScript. Mastering TypeScript can help programmers to write object-oriented programs and have them compiled to JavaScript, both on server side and client side.
Programmers coming from Object Oriented world will find it easy to use TypeScript. With the knowledge of TypeScript, they can build web applications much faster, as TypeScript has good tooling support.
Prerequisites
As a reader of this tutorial, you should have a good understanding of OOP concepts and basic JavaScript, to make the most of this tutorial.
What is TypeScript
TypeScript is an open-source pure object-oriented programing language. It is a strongly typed superset of JavaScript which compiles to plain JavaScript. It contains all elements of the JavaScript. It is a language designed for large-scale JavaScript application development, which can be executed on any browser, any Host, and any Operating System. The TypeScript is a language as well as a set of tools. TypeScript is the ES6 version of JavaScript with some additional features.
TypeScript builds on top of JavaScript. First, you write the TypeScript code. Then, you compile the TypeScript code into plain JavaScript code using a TypeScript compiler.
Once you have the plain JavaScript code, you can deploy it to any environments that JavaScript runs.
TypeScript files use the .ts extension rather than the .js extension of JavaScript files.
TypeScript uses the JavaScript syntaxes and adds additional syntaxes for supporting Types.
Why TypeScript
The main goals of TypeScript are:
- Introduce optional types to JavaScript.
- Implement planned features of future JavaScript, a.k.a. ECMAScript Next or ES Next to the current JavaScript.
1) TypeScript improves your productivity while helping avoid bugs
Types increase productivity by helping you avoid many mistakes. By using types, you can catch bugs at the compile-time instead of having them occurring at runtime.
The following function adds two numbers a and b:
function add(a, b) {
return a + b;
}
If you get the values from HTML input elements and pass them into the function, you may get an unexpected result:
let result = add(value1, value2);
console.log(result); // result of concatenating strings
For example, if users entered 5 and 10, the add() function would return 510, instead of 15.
The reason is that the value1 and value2 are strings, not numbers. When you use the operator + to add two strings, it concatenates them into a single string.
When you use TypeScript to explicitly specify the type for the parameters like this:
function add(a: number, b: number) {
return a + b;
}
In this function, we added the number types to the parameters. The function add() will accept only numbers, not any other values.
When you invoke the function as follows:
let result = add(value1, value2);
The TypeScript compiler will issue an error if you compile the TypeScript code into JavaScript. Hence, you can prevent the error from happening at runtime.
2) TypeScript brings the future JavaScript to today
TypeScript supports the upcoming features planned in the ES Next for the current JavaScript engines. It means that you can use the new JavaScript features before web browsers (or other environments) fully support them.
Every year, TC39 releases several new features for ECMAScript, which is the standard of JavaScript. The feature proposals typically go through five stages:
- Stage 0: Strawperson
- Stage 1: Proposal
- Stage 2: Draft
- Stage 3: Candidate
- Stage 4: Finished
And TypeScript generally supports features that are in the stage 3.