Remo H Jansen delivers a talk on TypeScript. Image: ACIA
Remo H Jansen from the Aon Centre for Innovation and Analytics outlines why TypeScript is important to organisations that are building any kind of JavaScript applications.
TypeScript is a programming language developed by Microsoft, a statically typed superset of JavaScript. This means that any valid piece of JavaScript code is also a valid piece of TypeScript code. However, TypeScript features a static type system, which is not available in JavaScript.
We introduced TypeScript as one of our core technologies at the Aon Centre for Innovation and Analytics (ACIA) in Dublin about a year ago. We have been able to experience how TypeScript complements JavaScript with features that make it more suitable for a large enterprise environment. In this article, I’m going take a look at some of these features.
1. Fewer compatibility issues
TypeScript compiles into JavaScript code and you can choose which version of JavaScript you would like to target (including ES3, ES5 and ES6). This means that TypeScript is not only a superset of the current version of JavaScript (ES5), but also a superset of the upcoming version of JavaScript (ES6).
Each of these versions has different compatibility levels with the available JavaScript engines. TypeScript allows you to use the features available in latest JavaScript version (ES6) and compile it into an old version of JavaScript (ES3) that will work in old browsers.
This can make your team more productive because you are able to use whatever feature you need, without having to worry about its compatibility with existing JavaScript engines.
2. Discover issues earlier
JavaScript is a dynamically typed programming language. You can change the type of a variable after it has been declared. For example, you can declare a variable, assign a numeric value to it and assign a string value to it later on:
var n = 3; n = "a";
On the other hand, TypeScript is a statically typed programming language and will throw a compilation exception if you try to change the type of a variable after it was assigned. The TypeScript type system includes a feature known as type inference, which is used to automatically detect the types of the variables in your application. Type inference allows you to write the exact same JavaScript and obtain very different results:
var n = 3; n = "a"; // Error: Type 'string' is not assignable to type 'number'.
Using the wrong types can lead to encountering an unexpected behaviour. For example, you might expect that the following function returns the sum of two numbers:
function sum(a, b) {
return a + b;
}
However, if you use a string and a number (instead of two numbers), you will encounter an unexpected result:
sum("5", 5); // "55"
The TypeScript type inference system will analyse the preceding function to try to determine the correct type of all the variables. Unfortunately, it won’t be able to detect the types of the function arguments and the type ‘any’ will be assigned to all the function argument. ‘Any’ is used to represent all the possible types:
function sum(a: any, b: any) {
return a + b;
}
You can use a syntax known as optional type annotations and the ‘noImplicitAny’ compilation option to ensure that your function arguments use the correct type:
function sum(a: number, b: number) {
return a + b;
}
Once you have provided TypeScript with the required annotation, the TypeScript compiler will be able to prevent many potential runtime issues by ensuring that you have used the correct types:
// Error: Argument of type 'string' is not assignable to parameter of type 'number'
sum("5", 5);
The TypeScript type system is very powerful and includes features like interfaces or generic types. These features are quite common in other statically typed programming languages like Java or C#.
However, TypeScript also supports other advanced type system features like algebraic data types, which are common in statically typed functional programming languages.
For example, one common algebraic data type in functional programming languages is the ‘Maybe’ type.
The Maybe type could be implemented in TypeScript 2.0 as follows:
type Maybe<T> = undefined | T;
The Maybe type is the union between the undefined type (used to represent the non-existence of a value) and the type of the value itself (T):
interface User {
name: string;
}
var maybeUserArray: Maybe<User[]> = fetchUsersFromServer();
// Error: Object is possibly 'undefined'
var userNames: string[] = maybeUserArray.map((user) => user.name);
Using some of the functional programming principles in combination with algebraic data types, like the Maybe type, will improve the predictability and testability of your source code.
3. Produce code that is easier to understand and refactor
Type annotations can provide more value than preventing runtime errors. They can be considered as a kind of source code documentation that can help us understand how a given piece of code behaves.
Type annotations are extremely beneficial when working with large code bases or within large development teams. These annotations can also be used by development tools to power refactoring features, which will enable your software development teams to continuously improve the existing code bases.
Remo H Jansen, web engineer, Aon Centre for Innovation and Analytics. Image: ACIA
4. Scale software development team easier
The TypeScript type system is easy to understand for back-end developers with experience in programming languages like Java or C#, while front-end JavaScript developers might find the type system a bit more difficult. However, a front-end developer should be able to learn TypeScript quickly as well because everything they know about JavaScript remains valid in TypeScript.
TypeScript can also help an organisation eliminate some of the differences between their front-end and back-end developers, bringing them closer with the movement of software engineers across teams.
In addition, if you choose to use Node.js for your back-end, you will be able to share TypeScript code between your front-end and back-end teams. Today it is possible to develop and share TypeScript code between web applications, server applications, desktop applications, native mobile applications and even drones!
The TypeScript type system features interfaces. Interfaces are also known as ‘contracts’ because they can be used to ensure that two pieces of software will respect a given set of rules. Interfaces are an extremely important tool when it comes to collaboration between software development teams.
In TypeScript, you can define a contract (an interface) between two teams so they can work independently. If one team doesn’t adhere to the contract rules, the TypeScript will throw a compilation error. Interfaces make TypeScript a much better option than JavaScript in terms of collaboration.
5. Embrace the JavaScript ecosystem
JavaScript is the most used programming language in the world today and it has more open source modules available than any other programming language.
Number of available open source modules per programming language. Image: Module Counts
In order to consume a JavaScript module from TypeScript, you need to define the public interface of the JavaScript module in a kind of TypeScript file known as type definitions. Many times you don’t even need to worry about this, as there are thousands of type definition files available online as open source already. This makes TypeScript effectively compatible with all the existing JavaScript libraries.
In addition, you can take advantage of the biggest community of software engineers in the world, a never-ending list of development tools and almost unlimited learning resources available for free.
JavaScript and TypeScript are extremely attractive value prepositions for any software organisation because using open source has been proven as a successful strategy for reducing the cost of software development. More open source modules available means that your organisation will need to produce less code.
6. TypeScript has a bright future
TypeScript was developed by Microsoft and it was originally announced by Anders Hejlsberg (the mind behind Turbo Pascal, Delphi and C#) in October 2012.
TypeScript has been an open source project from the outset and it can be considered an early indicator of the open source revolution that was about to transform Microsoft.
After its initial release, TypeScript gained some traction among .Net developers, but it wasn’t until about two-and-a-half years later, when the TypeScript team announced its partnership with Google in the development of Angular 2.0, that it started to become a mainstream technology. A year after this announcement, Microsoft became the company with the most open source contributors on GitHub, and TypeScript experienced a 3.5x growth on GitHub.
Just a couple of weeks ago, I had the opportunity to attend a Microsoft tech gathering event at the Convention Centre in Dublin and one of the most interesting talks was about the open source journey at Microsoft. During the presentation, Martin Woodward (executive director at the .NET Foundation) mentioned that Microsoft expects TypeScript to become one of the most used programming languages on GitHub over the next couple of years.
Learning TypeScript by Remo J Hansen. Image: Remo J Hansen
How can you learn more about TypeScript?
The easiest way to get started with TypeScript is by visiting its official website at www.typescriptlang.org. The website references many resources and an interactive text editor, which allows you to try TypeScript in your browser.
There are many other freely available learning resources online. Among these, we must highlight TypeScript Deep Dive, an open source book written by Basarat Ali, who can be considered as the leader of the open source TypeScript community. If you prefer to read physical books, you can consider my book Learning TypeScript, published last year by Packt Publishing.
If you live around Dublin, consider joining the Dublin TypeScript Meetup hosted at the Aon Centre for Innovation and Analytics every couple of months.
Remo H Jansen works as a web engineer at the Aon Centre for Innovation and Analytics. He is a Microsoft MVP on TypeScript, the author of Learning TypeScript and organiser of the Dublin TypeScript Meetup. Learn more about Remo by visiting his website or contact him via Twitter.
Disclaimer: Remo H Jansen is not a Microsoft employee and Microsoft has not sponsored this article. His views do not reflect the views of Microsoft.
