Generic Constraints, Generic Methods, and Generic Factories in TypeScript

In Introduction to Generics in TypeScript the idea of generics was introduced. It was shown how generics provide a mechanism for having a balance between writing code that is flexible enough to apply to a broad range of types but not too flexible that type safety is lost. 

This post will be a short one that builds on that and shows a couple of extra things that can be achieved when using Generics in TypeScript. Three things will be shown in this post: Generic Constraints, Generic Methods, and Generic Factories

Introduction to Generics in TypeScript

Generic provides a mechanism for writing code that is flexible enough to apply to a broad range of types but not too flexible that type safety is lost. 

What exactly does the above statement mean?

To demonstrate what it means we will define a class and a function that makes use of Generics. The generic class will be an implementation of a List, which only allows adding and retrieving an item and the generic function will be the identity function. 

Both the List data structure and the Identity function are good examples because they are straightforward enough to allow for easy demonstration of the generic concepts.

Let’s start with List.

Introduction to Advance Types in TypeScript

This is the start of a series of posts where I take a look at aspects of TypeScript's type system that can be referred to as "Advanced".  See this as an exploration of TypeScript’s type system past Classes and Interfaces.

A good mental model to have when exploring the advanced part of TypeScript type system is to see it as a mechanism for more sophisticated ways to create Types. 

The normal, non-advanced ways of creating types in TypeScript involve using features of the language like type alias,  class and interface. 

For example these: 

interface IPerson {
  name: string
  age: number
}

type TPerson = {
  name: string
  age: number
}

class CPerson {
  constructor(private name:string, private age: number) {}
  
  getName() {
    return this.name;
  }

  getAge() {
    return this.name;
  }
}

With the advanced type features, types can be constructed directly or indirectly based on other existing types. How exactly this is done, will be the subject of this series of posts.

The posts in the series include:

• Introduction to Generics in TypeScript
• Generic Constraints and More
• Union and Intersection Types - Published soon
• Indexed Access Types and KeyOf - Published soon
• Type Queries: Typeof operator - Published soon
• Conditional Types - Published soon
• Mapped Types - Published soon
• Literal and Template Literal Types - Published soon

How to apply type annotations to functions in TypeScript

This post explores the various ways of ascribing functions with type annotations in TypeScript. To fully appreciate the various ways of ascribing type annotations to functions, we would first take a quick look at the various ways functions can be defined in JavaScript. Once that is done, we then look at how to bring TypeScript static type annotation into the picture. 

There are mainly two ways of defining functions in JavaScript. Namely: 

• Function expressions 
• Function declarations. 

Let’s quickly go over how these look