Home > database >  How to await an async function in the constructor in JavaScript
How to await an async function in the constructor in JavaScript

Time:07-12

I'm writing a JS class, which calls wasmFunc in the constructor and saves its result to this.val. However, because wasmFunc is from a WebAssembly file, an async function loadWasm must be called before wasmFunc is callable. So I'm trying to achieve something like this:

// index.js
async loadWasm() {
   // load wasm file
}

export class MyClass {
  constructor() {
    await loadWasm(); // Cannot work
    this.val = wasmFunc();
  }
}

export const myObj = new MyClass();

Ideally, this file index.js should export myObj that is ready for use. However, await cannot be used in the constructor.

Any solutions or thoughts?

CodePudding user response:

  • Constructors must return an instance of the class being constructed
  • Async functions must return a promise

Since a function can only do one of those things, a constructor function can't be async.

Helper Function

You can use a helper function:

// index.js
async loadWasm() {
   // load wasm file
}

export class MyClass {
  constructor(wasm) {
    this.val = wasm;
  }
}

async function myClassFactory() {
    const wasm = await loadWasm();
    const instance = new MyClass(wasm);
    return instance;
}

You'll need to await the result of calling myClassFactory().

Store a promise in the object

You could also store a promise in the object you create:

// index.js
async loadWasm() {
   // load wasm file
}

export class MyClass {
  constructor() {
    const wasmPromise = loadWasm(); // Cannot work
    this.val = wasmPromise;
  }

  async doSomethingWithValue() {
    const wasm = await this.val;
    console.log(wasm);
  }
}

CodePudding user response:

export class MyClass {
    async loadWasm() {
        
    }

    async fn(){
        await this.loadWasm(); // Cannot work
        this.val = wasmFunc();
    }

  constructor() {
    this.fn()
  }
}

export const myObj = new MyClass();

try this. This should work for you.

CodePudding user response:

class MyClass {
    async constructor() {

    }
}

-> Uncaught SyntaxError: Class constructor may not be an async method

Edit: But you can this.

class MyClass {
    constructor(args) {
        this.arguments = args;
    };
    static async new(...args) {
        return new this(args);
    }
}
-> MyClass.new("test")
  • Related