异步延迟JS直到满足条件

时间:2011-09-26 18:16:53

标签: javascript asynchronous google-closure-library

我有一个类ChatRoom,它只能在收到长时间运行的HTTP请求后呈现(可能需要1秒或30秒)。所以我需要延迟渲染,直到ChatRoom.json不为空。

在下面的代码中,我正在使用Closure Library的goog.async.ConditionalDelay。它有效,但是有更好的方法(可能不需要Closure Library)吗?

ChatRoom.prototype.json = null; // received after a long-running HTTP request.

ChatRoom.prototype.render = function() {
    var thisChatRoom = this;

    function onReady() {
        console.log("Received JSON", thisChatRoom.json);
        // Do rendering...
    }

    function onFailure() {
        alert('Sorry, an error occurred. The chat room couldn\'t open');
    }

    function isReady() {
        if (thisChatRoom.json != null) {
            return true;
        }
        console.log("Waiting for chat room JSON...");
        return false;
    }

    // If there is a JSON request in progress, wait until it completes.
    if (isReady()) {
        onReady();
    } else {
        var delay = new goog.async.ConditionalDelay(isReady);
        delay.onSuccess = onReady;
        delay.onFailure = onFailure;
        delay.start(500, 5000);
    }
}

请注意,“while(json == null){}”是不可能的,因为这将是同步的(阻止所有其他JS执行)。

3 个答案:

答案 0 :(得分:21)

考虑一下:

(function wait() {
    if ( chatroom.json ) {
        chatroom.render();
    } else {
        setTimeout( wait, 500 );
    }
})();

这将每半秒检查一次。

现场演示: http://jsfiddle.net/kBgTx/

答案 1 :(得分:1)

您还可以使用具有递归功能的lodash的去抖动器来实现此目的。

public class GameManager: MonoBehavior{
  private void Start(){
    cube.Instance.ChangeCubeName("Joe");
  }
}

答案 2 :(得分:-1)

我想出的答案是这样的:

var count = 0;
// Number of functions that need to run. This can be dynamically generated
// In this case I call check(data, cb) a total of 3 times
var functionNum = 3; 
function toCallAfter(){
    console.log('I am a delayed function');
}

我有一个检查功能,它定期运行一次,循环运行两次:

check(data, function(err){ // check is my asynchronous function to check data integrity
    if (err){
        return cb(null, { // cb() is the return function for the containing function
            errCode: 'MISSINGINFO',
            statusCode: 403,
            message : 'All mandatory fields must be filled in'
        });
    } // This part here is an implicit else
    count++; // Increment count each time required functions complete to
             // keep track of how many function have completed
    if (count === functionNum) {
        return anon();
    }
    return;
});
// Run twice more in a loop
for(var i = 0; i < 2; i++) {
    check(data, function(err) { // calls check again in a loop
        if (err){
            return cb(null, {
                errCode: 'MISSINGINFO',
                statusCode: 403,
                message : 'All mandatory fields must be filled in'
            });
        }
        count++;
        if (count === functionNum) {
            return toCallAfter();
        }
        return;
    });
}

最后,我想在替代(并且非常常见)的答案中指出一个重大的性能错误:

(function wait() {
    if ( chatroom.json ) {
        chatroom.render();
    } else {
        setTimeout( wait, 500 );
    }
})();

在这种情况下,您实际上是将每次检查的浏览器或服务器(如果使用node.js)保留500毫秒,这对于计算机来说是非常长的时间。意味着巨大的性能打击。我直接跟踪所需完成功能的解决方案没有时间限制,一旦所有功能完成,我们将立即运行。