Tuesday, February 16, 2021

Overview of Indexable Types In TypeScript

This blog post will look at Indexable Types. It is part of the Introduction to Advanced Types in TypeScript series.

In JavaScript, there are values, from which additional values can be retrieved via an index. A natural example of such a value is an Array: For example, given the following array:

const primaryColors =  ["red", "green", "blue"]

The value primaryColors is an array value, and its individual content can be accessed by providing an index of type number:

console.log(primaryColors[0])
console.log(primaryColors[1])
console.log(primaryColors[2])

Sunday, February 07, 2021

Using Literal and Template Literal Types in TypeScript

This blog post will look at some of the use cases of literal and template literal types in TypeScript. It is a continuation of Literal and Template Literal Types, which introduces the language feature and it is a part of the Introduction to Advanced Types in TypeScript series.

This post will look at the following use cases:

  1. Compile time spell checker
  2. Alternative to enum
  3. Discriminated Union Pattern
  4. Stricter Type Constraints and Type Level Computation

Monday, February 01, 2021

Literal and Template Literal Types

This blog post will look at Literal and Template Literal Types. It is part of the Introduction to Advanced Types in TypeScript series.

In the post, Union and Intersection Types in TypeScript, the idea of viewing types with the perspective of Set theory was introduced. The key idea is to see types more or less as sets, and values of a type as elements that belong to a set. If this idea of viewing types from the perspective of Set theory is new to you, then I’ll advise to take a pause and read Union and Intersection Types in TypeScript before continuing with the rest of the post, because it is a useful perspective to understand literal types.

Monday, January 18, 2021

Union and Intersection Types in TypeScript

This blog post will look at Union and Intersection types in TypeScript. It is part of the Introduction to Advance Types in TypeScript series.

Union and Intersection types are useful features of TypeScript. But they can come across as a bit strange, especially to developers coming from more traditional languages like Java, C#, etc. Hence in this post, I will first start with a background section. This will help in developing the fundamental perspective needed to understand and appreciate union and intersection types in TypeScript.  

Wednesday, January 13, 2021

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

Monday, January 11, 2021

Introduction to Generics in TypeScript

Generics 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 Generics concepts.

Let’s start with List.

Introduction to Advanced 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 more sophisticated mechanism for creating types. 

The normal, non-advanced ways of creating types in TypeScript involve using features of the language like type aliasclass 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: