Recursive Types in TypeScript

Question

Let's suppose we try to create HTML build helper

build([
  'html', { lang: 'en' }, [
    ['head', [
      ['title', 'Hello, world!']
    ]
  ]
])

The type declaration for arguments of the build would be (actually it will be more complicated but let's consider just the simplest case)

type Node = [string, { [key: string]: string }, Node[]]

Unfortunately id didn't works, because TypeScript complains

TS2456: Type alias 'Node' circularly references itself.

Is there any workaround?

Answer 1

Type aliases can't be circular, but interfaces can. This accomplishes what you want:

type MyTuple<T> = [string, { [key: string]: string }, T[]];
interface Node extends MyTuple<Node> { }

Answer 2

This can now be done as of typescript 3.7: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#more-recursive-type-aliases

For example:

type ValueOrArray<T> = T | ValueOrArray<T>[];
type NestedStringArray = ValueOrArray<string>;

const nestedStringArray: NestedStringArray = [
  'hello',
  ['w', ['o', 'r', 'l'], 'd'],
];