jquery - Why is my synchronous code using setTimeout behaving asynchronous in JavaScript? - Stack Overflow

admin管理员组

文章数量:1435859

I'm trying to loop 10x over a test (waiting for the condition to be true), but somehow it's not working.

Here is what I have:

// my counter
$.testHelper.countDown = function(test, iteration) {
    var ticker = iteration || 0;
    if (ticker > 10) {
      return false;
     }
    window.setTimeout(function() {
        if (test === true) {
            console.log("SENDING");
            return true;
        }
        ticker += 1;
        $.testHelper.countDown(test, ticker);
     }, 1000);
    };

    // my test     
    $.testHelper.testForElement = function(element) {
        var result;   
        console.log($i.find(element).length > 0); // true
        result = $.testHelper.countDown(
             $i.find(element).length > 0
        );
        console.log(result);  // undefined
        return result;
     };

My problem is that although my condition equates to true before I'm calling countdown, the answer from countDown is undefined. So my logs e in like this:

// true - before firing my countDown method
// undefined - should not log
// SENDING - response from countDown (= true)

Question:
From the code displayed, is there a reason, why my undefined is logged before countDown is through and returns true?

Thanks!

I'm trying to loop 10x over a test (waiting for the condition to be true), but somehow it's not working.

Here is what I have:

// my counter
$.testHelper.countDown = function(test, iteration) {
    var ticker = iteration || 0;
    if (ticker > 10) {
      return false;
     }
    window.setTimeout(function() {
        if (test === true) {
            console.log("SENDING");
            return true;
        }
        ticker += 1;
        $.testHelper.countDown(test, ticker);
     }, 1000);
    };

    // my test     
    $.testHelper.testForElement = function(element) {
        var result;   
        console.log($i.find(element).length > 0); // true
        result = $.testHelper.countDown(
             $i.find(element).length > 0
        );
        console.log(result);  // undefined
        return result;
     };

My problem is that although my condition equates to true before I'm calling countdown, the answer from countDown is undefined. So my logs e in like this:

// true - before firing my countDown method
// undefined - should not log
// SENDING - response from countDown (= true)

Question:
From the code displayed, is there a reason, why my undefined is logged before countDown is through and returns true?

Thanks!

• javascript
• jquery
• jquery-mobile
• timeout
• qunit

Share Improve this question Follow asked Mar 28, 2014 at 23:06 frequentfrequent 28.6k6161 gold badges187187 silver badges336336 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

Erm, because setTimeout is always asynchronous? That's kind of the whole point.

Here's a possibility for you:

function when(condition,then) {
    // condition must be a callback that returns `true` when the condition is met
    if( condition()) then();
    else setTimeout(function() {when(condition,then);},1000);
}

This will poll once every second until the condition is met, and then do whatever is given in the then callback.

本文标签： jqueryWhy is my synchronous code using setTimeout behaving asynchronous in JavaScriptStack Overflow