javascript - 在类中的 promise 中回调？

Question

我有一个用于通过 XMLHttpRequest 加载外部资源的类(这是针对 WebGL 的)，所以我正在加载模型、着色器等。我的计划是在它执行所有这些请求时放置一个加载显示，然后当它最终完成时，我希望它从创建它的原始函数运行一个回调函数。但是，当我尝试运行该回调时，我得到了奇怪的结果(例如它无法访问类中进行加载的任何对象)。

我可以通过将“this”传递给加载类然后执行

来解决这个问题

self = this; 
promise(self.callback());

但我更愿意指定我希望它在完成加载后回调的函数。有谁知道这是否可以做到？我的代码如下所示:

主类

this.loadingClass = new LoadingClass(this.LoadingComplete, resources);

Main.prototype.LoadingComplete = function()
{
    // Returns undefined if i specify the callback function instead of just "this"
    console.log(this.loadingClass.anyOfTheMembersOfThisClass);
}

加载类

LoadingClass = function(callback, resources) {

  ..

        Promise.all(resources).then(function(loadedResources)
        {
            ..
            callback();

        });
}

Answer 1

当你传递函数对象时

(this.LoadingComplete, resources)

它所绑定(bind)的对象将不会被传递。因此，只有函数对象 LoadingComplete 被传递给 LoadingClass 并且当它被调用时

callback()

this 值将是undefined(在严格模式下)。

要解决这个问题，

• 你需要像这样绑定(bind)this对象

  new LoadingClass(this.LoadingComplete.bind(this), resources)
  

• 如果您的环境支持 ES2015 的箭头函数

  new LoadingClass(() => this.LoadingComplete(), resources);
  

在这两种情况下，当 LoadingClass 调用 LoadingComplete 时，this 将被保留。