TypeScript Language Features
TypeScript Language Features#
In this section, we dive deep into TypeScript's language features. We start by reviewing the fundamentals, including: type aliases, primitive types, arrays, objects, and functions. Then we explore the ECMAScript features available to TypeScript, covering the major features introduced in ES2015.
To run our code snippets, we'll be using the official TypeScript Playground: http://www.typescriptlang.org/play/
Go ahead and check all of the available options in the "Options" tab of the playground:
The gist of these options are that we are enabling flags that help prevent code smells and force us to code against stricter rules (hence the strict prefix).
We'll start by covering an extremely useful feature that we will use throughout the rest of the book: type aliases.
Type aliases allow us to assign names to type expressions. By doing so, we avoid having to rewrite those expressions and we are able to give meaningful names to our types. In the example below, we use a type alias to define a
The right-hand side of the
= symbol must be a type expression, which may be another type or the result of operating on several types (such as a union or intersection of types, which we'll learn about later in the chapter). We cannot use a runtime expression, such as a function call or the result of a mathematical operation.
StudentId can be used as the type of our variables:
StudentId is just a reassignment of
string, the lines above are equivalent to:
Using type aliases over simply using
string gives us two benefits:
Our code is more readable as we now know that
lastStudentrefer to unique identifiers as opposed to generic strings, which can have multiple interpretations (i.e. a student's name).
The logic behind the
StudentIdtype is centralized. If there is ever a need to change the definition of
StudentId(i.e. from using
number), we can make the change in one location while being warned of any type errors resulting from the change.
Type aliases are exportable, so we can export
StudentId using the
export keyword and use it throughout our application:
Note that imports and exports are not testable through the TypeScript Playground.
StudentId from another file, we use the
import keyword and the name of the imported type:
We'll cover imports and exports in-depth in the TypeScript Modules section of this chapter.
To sum it all up: type aliases are useful for centralizing logic, giving meaningful names to types, and even shortening lines that contain long type expressions. In many cases, they can make code more readable and succinct, so we use them liberally throughout our code.
Primitive types are a set of pre-defined types that cannot be broken up into smaller types. They are the building blocks of more complex types, such as arrays and objects.
In TypeScript, the primitive types are:
In this section we'll cover every primitive except for
symbol (ES2015) and
bigint (ESNext), which are covered in another chapter, Advanced Language Features.
Before diving into our primitives, let's discuss a common pitfall: using
Boolean over their lowercase counterparts:
boolean. In general, you should never use the uppercase variants as they refer to objects and not primitives. Using a combination of the two can lead to unexpected errors. In the example below, we see that
Number is not assignable to