JavaScript - 等待/阻塞，直到构造函数完全加载

Question

我正在创建的 JavaScript API 具有以下结构:

var engine = new Engine({
    engineName: "TestEngine",
    engineHost: "localhost"
});

// I don't want to proceed to the next line until Engine is fully loaded
// But the following part of the API is immediately called before the above is loaded
engine.startCar(
    "car_name",
    "car_id"
);

“引擎”实例加载需要几秒钟(1-2 秒)。所以在那之前， engine.startCar 不应被调用。

如何对构造函数 ( new Engine() ) 进行内部更改，使其在完全加载之前不会返回实例？

Answer 1

这是 JavaScript 中的标准问题。通常它发生在您发出 AJAX 请求时，但基于超时的延迟具有相同的基本问题。

jQuery 和大多数存在此类问题的库通过使用返回“延迟”或“ promise ”对象的初始方法来解决此问题，该对象可用于说“当 X 完成时，做 Y”。

这最好通过例子来解释。如果您在 Engine 构造函数中执行以下操作:

function Engine(option) {
     var readyDeferred = new $.Deferred();
     this.ready = readyDeferred;
     window.setTimeout(1000, function() {
         readyDeferred.resolve();
     }
}

当您构建引擎时，您可以简单地执行以下操作:

var engine = new Engine({...});
engine.ready.done(function() {
    // start your engines!
});

当然，由于客户端机器的时间不同，如果您可以使用 window.setTimeout 以外的一些逻辑来触发您的 readyDeferred.resolve(); 会更好。 。例如，您可能会在所有 AJAX 请求都完成时触发它，这比任何特定的等待时间都更容易预测。