5 Key features of TypeScript

TypeScript extends JavaScript with a static type system and additional features that help developers write safer and more maintainable code.

Here are five of its key features.

1. Static Typing

One of the main features of TypeScript is static typing. Types can be explicitly assigned to variables, function parameters, and return values.

let username: string = "Daryl";
let age: number = 57;

age = "58";
// Error: Type 'string' is not assignable to type 'number'.

TypeScript can detect this error before the code is executed.

This is especially useful in larger applications where incorrect data can otherwise be difficult to track down.

2. Type Inference

TypeScript does not require every type to be written explicitly.

It can often infer the type from the value:

let username = "Daryl";
let age = 57;

age = "58";
// Error

TypeScript knows that username is a string and age is a number without explicitly declaring those types.

This provides type safety without making the code unnecessarily verbose.

3. Interfaces and Type Aliases

TypeScript allows developers to describe the structure of objects using interfaces or type aliases.

interface User {
    name: string;
    email: string;
    age: number;
}

const user: User = {
    name: "Daryl",
    email: "daryl@example.com",
    age: 57,
};

Type aliases can be used in a similar way:

type Product = {
    name: string;
    price: number;
};

These types can then be reused throughout an application, making the structure of data explicit.

4. Union Types and Type Narrowing

A union type allows a value to have more than one possible type.

let id: string | number;

id = 123;
id = "user-123";

When working with a union, TypeScript can narrow the type based on runtime checks.

function printId(id: string | number) {
    if (typeof id === "string") {
        console.log(id.toUpperCase());
    } else {
        console.log(id.toFixed());
    }
}

Inside each branch, TypeScript knows which type id is.

5. Generics

Generics allow functions, classes, and types to work with different data types while preserving type information.

function getFirst<T>(items: T[]): T {
    return items[0];
}

const number = getFirst([1, 2, 3]);
const name = getFirst(["Daryl", "Rick"]);

TypeScript can infer that number is a number and name is a string.

This makes it possible to create reusable code without giving up type safety.

Conclusion

TypeScript adds a powerful type system on top of JavaScript.

Static typing, type inference, reusable types, union types, and generics are some of the core features that make TypeScript useful for building larger and more maintainable applications.