javascript - 在导出的类中使用异步 js 导入

Question

给定一个公开异步/动态导出的包。我目前以这种方式导入(但我可以以不同的方式导入它):

(async function() {
  const libEd = await import("../../.cache/ed25519wars/index.js");
})();

我打算将 libEd 中的一些函数重新公开为类的一部分:

export class Something {
  static from_X() {
    return libEd.genFromX();
  }

  do_Y() {
    return libEd.doY();
  }
}

我该怎么做？

<小时/>

了解更多信息:

• 公开异步/动态导出的包是由 webpack 打包 web assembly 生成的。我不确定我是否可以更改这部分的任何内容
• 我绝对可以改变导入该包的方式
• 我还可以更改重新公开/分组函数的方式(并使用类以外的其他内容)

Answer 1

我可以通过几种方法来解决这个问题:

1. 如果类不需要立即实例化，那么我将等待库加载，然后将其传递给类构造函数。这是最简洁的方法，因为库始终在类中定义。

2. 如果类必须在获取库之前实例化，则类中的方法必须处理未定义的情况(例如尚未加载)。然后，您可以调用诸如 await myClassInstance.init() 之类的方法来获取库。如果库尚未加载，我通常会为每个方法提供一个后备，也许它会返回一个空字符串或一个虚拟 UI。

编辑:为选项 1 添加 TypeScript 示例

interface MyLibrary {
  libraryMethod: () => void;
}

class ExampleClass {
  localLib: MyLibrary;

  constructor(lib: MyLibrary) {
    this.localLib = lib;
  }

  myClassMethod() {
    this.localLib.libraryMethod();
  }
}

async function run() {
  // first we fetch the remote library
  const myLibrary: MyLibrary | undefined = await import('/lib.js');

  // good practise to add some check here
  if (!myLibrary) {
    throw Error('failed to fetch myLib');
  }

  // then we create the class instance using the downloaded library
  const myClassInstance = new ExampleClass(myLibrary);

  // now we can call our class method which definitely has the remote library
  myClassInstance.myClassMethod();
}