How to Write an Async Class Constructor in TypeScript or JavaScript

Without using the common “init” or “builder” patterns

Photo by Julian Dik on Unsplash

Creating a Class Object: The Commonly Suggested Methods

init and builder are the two methods I most often see recommended for creating a class object that requires an async process.

Instance init()

class MyClass {
  constructor() {
    // set props normally
    // nothing async can go here
  }
  public async init() {
    // do your async steps here
  }
}

The init method is one in which you define an async instance method, performing all your async setup as an additional step, after object instantiation.

const myClassInstance = new MyClass()
// need to remember to call this on the instance
await myClassInstance.init()

The issue I have with this approach is that you have to trust that the caller creating the class remembers to call the init() method whenever an instance of the class is created. This is obviously error-prone and requires that the caller has that context about the class.

Class Object Builder

class MyClass {
  constructor() {
    // set props normally
    // nothing async can go here
  }
  public static async build(): Promise<MyClass> {
    // do your async stuff here
    // now instantiate and return a class
    return new MyClass()
  }
}

The class object builder method is a little better. This approach is also used in other languages as a sort of workaround. It involves writing a static method on the class object, which performs the asynchronous processing before instantiating the class object synchronously and returning it.

const myClassInstance = await MyClass.build()

I like this approach better than the previous one as it reduces the burden on the caller to remember to call an additional init() function. However, there’s still a need for the caller to have the context to use a non-standard static class method to instantiate the class instead of the standard new MyClass() syntax. There’s no way to make the constructor private, or to ensure you avoid this easy-to-make mistake. EDIT: This is still true for Javascript but Typescript 2.x does provide private/protected decorators for the class constructor method, which would enforce only the ‘build’ method can instantiate the class. Add that to the long list of reasons to use Typescript over Javascript ;)

The Functional Options Pattern

I have written previously about how the functional options pattern can be used to cleanly construct classes:

Using a Golang pattern to write better Typescript

I realized that by using this pattern to construct classes you’ve done yourself the favor of making it trivial to construct classes that require asynchronous processing upon creation, without needing anything extra like remembering to call an init() function after the creation of the object.

Async Option Constructor

Below is an extension of my previous House example class that I used to demonstrate construction via functional options. As you can see, all that’s needed for async creation is the creation of an async options constructor:

Class definition allowing for function option construction of the class

Construction is easy!

Adopting the functional options pattern for class construction has other benefits, but in particular, it allows for the creation of a class object that may require asynchronous processes. The async function call can be added right into the class instantiation step, without needing a separate init() call or having to modify your established method of class construction. Callers can use the standard new House() syntax to instantiate the class and use your established pattern of static class constructors to build their object instance, without needing much additional context on the class implementation.

Happy coding!