Tip of the Day — Typescript dynamic types

In Typescript, we can make our types dynamic with union types, intersection types, and index signatures.

union types

A union type allows us to define a variable with multiple types.

let myVar: number | string;

intersection types

An intersection type combines multiple types into one.

interface IEmployee {
    id: string;
    age: number;
    name: string;
}
interface IContractEmployee {
    termDuration: string;
}
type A = IEmployee & IContractEmployee;
let x: A;
x.age = 5;
x.id = 'CID5241';
x.termDuration = 'one week';

index signatures

In javascripy we can access to a member of an object by key. This is where we use index signature types.

type RestrictedStyleAttribute = "color" | "background-color" | "font-weight";
type IRestrictedStyle = {
    [T in RestrictedStyleAttribute]: string;
}