Now that we've introduced TypeScript and have briefly covered JavaScript's history, evolution, and gotchas, we can finally discuss why TypeScript is relevant and why you should use it.
How can TypeScript help?
Enhanced JavaScript
First and foremost, TypeScript does not aim to replace JavaScript; instead, it aims to improve the lives of developers by providing a more powerful language that generates clean and simple JavaScript code. In a way, you could consider TypeScript as a code quality checker for JavaScript on steroids.
Future JavaScript today
A second big benefit is that TypeScript allows you to use the newest ECMAScript features right now, whether you're targeting the latest version of Node.js or Internet Explorer 11 (poor soul!). This is great because it means that you don't need to wait until everything is supported in the target environment.
You can very easily configure the TypeScript compiler to generate ES3-, ES5-, ES2015-, ES2016-, ES2017-, ES2018-, ES2019-, or ESNext-compatible code.
To make this clearer, let's take an example. In TypeScript, you can create classes while transpiling your code to ES3-compliant code, even though classes were only introduced in ES2015. The TypeScript compiler only performs transformations to use language constructs that existed in that version of ECMAScript. When TypeScript does this, we often talk about down-level emit. There are many features of most recent ECMAScript versions that you can use with TypeScript while targeting ES5.
Static typing
One of the best features of TypeScript is its powerful type system added on top of JavaScript. This alone should appeal to any developer who is used to working with strongly typed languages, and thus, used to benefiting from great IDE support.
When you develop using C# or Java with a solid editor/IDE, you get powerful auto-completion, refactoring support, access to the documentation, in-context hints, and warnings and errors, all for free. TypeScript provides the same developer experience for the JavaScript ecosystem and allows developers to benefit from a highly productive development environment. This is great for all developers, not only larger teams.
Whether you're a fan of static or dynamic typing, TypeScript will make you happy as types in TypeScript are optional and TypeScript has very powerful type inference capabilities. Moreover, type inference improves with each new release of the compiler.
Put simply TypeScript definitely will help you discover bugs earlier and it will help you to better organize and structure your code, whether you're working on a small application or a large project.
Structural typing
In TypeScript, usually, if things quack like ducks, then TypeScript assumes that they're ducks. Duck typing as it is called is baked into the language. We can say that TypeScript considers the compatibility of types. We’ll leverage this great feature in the projects to make things clear.
To give you an idea, if some function expects to receive an object of a Foo type and is instead called with an object of a Bar type, then TypeScript will not complain as long as Bar has the same structure as Foo. That is to say, a Bar object can be considered to be Foo if it exposes at least the expected properties/methods.
This is an oversimplification as there are actually many rules at play, depending on the considered types.
Structural typing is very useful as it helps avoid writing quite some boilerplate code; one example is when you have two equivalent data structures. In programming languages that don't support structural typing, you have to manually convert from one type to the other, just because the compiler doesn't recognize the structural compatibility of the types.
TypeScript does also supports some nominal typing (that is, non-structural). Nominal typing is interesting for cases where you want to distinguish objects with different types, even if their structure is identical.
We won't be covering nominal typing specifically in this book as it is more advanced, but do check out the following link if you're curious: https://basarat.gitbooks.io/typescript/docs/tips/nominalTyping.html.
Types for JavaScript libraries
Having auto-completion and type information for third-party libraries that you use is a huge time saver and it can also help you avoid many bugs. Now, you might wonder how TypeScript can provide you with type information for third-party libraries when they are not written themselves in TypeScript. Well, the TypeScript team and the community have got you covered!
TypeScript supports type definitions, also known as typings. Type definitions are sets of declarations that provide additional information to the compiler (somewhat similar to header files in C). You'll discover how this works while working on the projects of this book.
Type definitions are maintained for most major libraries and are maintained either by the community or the library developers themselves. In most cases, typings are available on DefinitelyTyped, a community-driven repository of type definitions available on GitHub, over at https://github.com/DefinitelyTyped/DefinitelyTyped.
In the following article, you can find the history of DefinitelyTyped, explaining how it came to be and how it has evolved to become so central in the TypeScript ecosystem: https://blog.johnnyreilly.com/2019/10/definitely-typed-movie.html.
This isn't perfect because, sometimes, type definitions fall out of sync with the corresponding library (for example, after a new release) or are flat-out wrong but, most of the time, they definitely improve the developer experience and code quality.
As a matter of fact, type definitions are also useful for JavaScript developers as they provide information about the library APIs that might not even be documented otherwise.
.NET and Java developers will feel at home
TypeScript will feel natural for any Java or .NET developer as it supports many of the concepts that developers with that background should be familiar with.
Career-wise, learning TypeScript is beneficial for any backend developer as more and more code is written using JavaScript and TypeScript nowadays.
TypeScript supports object-oriented programming (OOP) concepts through classes, inheritance, constructors, property accessors, methods, and interfaces. It also supports enums, generics, iterators, generators, modules, decorators (also known as annotations), and many others.
If you only consider the OOP and modularity features of TypeScript, you can easily understand that it makes it much simpler to structure and organize your code base while defining your domain model using familiar concepts.
Also, since it is a superset of JavaScript, it also has great support for functional programming.
Having prior experience with all these concepts certainly gives you an edge to quickly get up to speed with TypeScript.
If you're coming from Java, .NET, or a similar language, do not underestimate the differences between the language(s) you are familiar with and TypeScript; some are quite profound. For example, the this keyword exists both in JavaScript and TypeScript, but it behaves differently in both, which can be very surprising.
That being said, one of the reasons for me (Sébastien) to introduce TypeScript at work a few years back (2016), was to allow our Java development teams to participate in the development and maintenance of frontend applications. At the time, we were developing JavaServer Faces (JSF)-based web applications almost completely in Java, so the introduction of RESTful web services and single page applications was quite a revolution. The fact that we have chosen to use TypeScript really helped the teams to quickly get on board and, in hindsight, it was a really good choice.
Of course, the matter is more complex than this; it isn't because our developers could contribute to the elaboration of frontend application code that they became frontend developers overnight. In our humble opinion, frontend and backend developers usually have a fundamentally different focus during their work. Some have a good feeling for user experience and user interface development and some others just don't.
By now, you have enough background information about JavaScript, TypeScript, how they fit together, and why you have chosen the right language to learn at the right time.
So, let's get started, shall we?
