Introduction

This is an extended description of types in TypeScript.

List of Primitive Types in JavaScript

typReturned Type by typeofWrapper
Null"object"-
Undefined"undefined"-
Boolean"boolean"Boolean
Number"number"Number
BigInt"bigint"BigInt
String"string"String
Symbol"symbol"Symbol

In TypeScript, all of the above-mentioned types are dynamic types. This means that these are the only types that will be used during the execution of a computer program.

Object as a Dynamic Type but not a Primitive Type

Additionally, it should be noted that the Object type is a complex and dynamic type, meaning that the object type is also used at runtime in the execution of the program.

typReturned Type by typeofWrapper
Object"object"-

Two Levels of the Language: Dynamic and Static

Dynamic Level

The dynamic level is 100% controlled by JavaScript. This is where variables are handled during program execution.

Static Level

The static, or lexical level, is 100% handled by TypeScript. All types are declared while writing the program by the developer. This is also where the type-checking system can verify the correctness of the type definition. Additionally, all static types only "exist" during compilation. Once the program is running, JavaScript takes control.

Here’s a simple example:

const value: number = 10;

Dynamically -> we use JavaScript to declare the variable value and initialize it with the numeric value 10.

Statically -> we use TypeScript to declare the type number.

Defining Types Using Type Expressions

A type expression is declared after a colon. Here are some example types:

Static Types for JavaScript's Dynamic Types

Types Specific to TypeScript

Type Inference

Sometimes, the type of a variable, function parameter, or return value doesn't need to be explicitly defined. Type inference is based on mathematical rules that can deduce the type.

If a variable, function parameter, or return type isn't explicitly declared and TypeScript can't infer the type, the variable defaults to the any type.

function toString(num: number) {
return String(num);
}

TypeScript can automatically infer that if we return String(num), we expect the type to be string.

Type Annotations

Let’s revisit and complete the code from the previous section.

function toString(num: number): string {
return String(num);
}

num: number -> this is a function parameter where num has the number annotation.

function toString(): string -> function declaration, where string is the annotation for the return type.

Alias

In TypeScript, you can also create an alias.

type Age = number;
const age: Age = 82;

List (Array)

We can declare a list in two ways:

let arr1: string[] = [];
let arr2: Array<string> = [];

A list has two properties:

  1. The list can only store values of the same type.
  2. The length of the list is dynamic and can change. The length depends on the programmer.

Tuple

We declare a tuple as follows:

let point: [number, number] = [7, 5];

A tuple has two properties:

  1. It can store values of different types.
  2. The length of the tuple is fixed at the time of its declaration.