Question

141

setTimeout on Asynchronous function

rated 0 times [ 146] [ 5] / answers: 1 / hits: 18395 / 13 Years ago, sat, november 26, 2011, 12:00:00

I have a asynchronous function that I want to have a 5000ms delay before being fired. I am trying to use setTimeout() to achieve this. This async function occurs in a loop that runs several times, with the async function being passed different data each time, thus setInterval() cannot be used here.

Problem: The async function gets triggered instantly without delay (console prints 5 Done messages instantly` and loops without any delay. What happened, and how can I solve it?

Javascript Code

someFunction(listings, function() {

    for (var i in listings ) {

        var listing = listings[i];

        setTimeout(asyncFunction(listing, function(data) {

            console.log('Done');

        }), 5000);

    }

});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jennie

Add To Favorites

Follow

Total Points: 593

Total Questions: 102

Total Answers: 106

Location: Federated States of Micronesia

Member since Fri, Sep 16, 2022

2 Years ago

jennie questions

1 Is there a React equivalent of Vue's nextTick() function?

Tue, Jun 21, 22, 00:00, 2 Years ago

1 how to loop to expect a list of item in jest

Tue, Feb 8, 22, 00:00, 2 Years ago

1 arrow function expected no return value with clean-up function in useEffect

Sun, May 23, 21, 00:00, 3 Years ago

1 React Re-Render Causes Flickering : How can i fix this?

Thu, Mar 4, 21, 00:00, 3 Years ago

1 React onChange not working for input inside functional component

Thu, Feb 25, 21, 00:00, 3 Years ago

View All

answered 13 Years ago jesse · Accepted Answer

You have to wrap the function in another function. Currently, you're invoking the function, and passing the return value as an argument to setTimeout. The code below will (correctly) pass a function to setTimeout. After 5 seconds, the function executes.

I had to add two functions to achieve the desired behaviour, because of scoping issues. After 5 seconds, the loop has already finished, and the listing variable would be equal to the last element in listings.

someFunction(listings, function() {

    var counter = 0;  // Define counter for 5 second-delays between each call

    for (var i in listings ) {

        var listing = listings[i];

        (function(listing){ //Closure function

            setTimeout(function(){ //setTimeout function

                // Because of the closure, `listing` is unique

                asyncFunction(listing, function(a, b) {

                    console.log('Done');

                });

            }, 5000 * ++counter); //Increase counter for each loop

        })(listing);

    }

});