Calling functions with setTimeout()

by

The first form that you list works, since it will evaluate a string at the end of delay. Using eval() is generally not a good idea, so you should avoid this.

The second method doesn’t work, since you immediately execute a function object with the function call operator (). What ends up happening is that playNote is executed immediately if you use the form playNote(...), so nothing will happen at the end of the delay.

Instead, you have to pass an anonymous function to setTimeout, so the correct form is:

setTimeout(function() { playNote(currentaudio.id,noteTime) }, delay);

Note that you are passing setTimeout an entire function expression, so it will hold on to the anonymous function and only execute it at the end of the delay.

You can also pass setTimeout a reference, since a reference isn’t executed immediately, but then you can’t pass arguments:

setTimeout(playNote, delay);

Note:

For repeated events you can use setInterval() and you can set setInterval() to a variable and use the variable to stop the interval with clearInterval().

You say you use setTimeout() in a for loop. In many situations, it is better to use setTimeout() in a recursive function. This is because in a for loop, the variables used in the setTimeout() will not be the variables as they were when setTimeout() began, but the variables as they are after the delay when the function is fired.

Just use a recursive function to sidestep this entire problem.

Using recursion to deal with variable delay times:

  // Set original delay
var delay = 500;

  // Call the function for the first time, to begin the recursion.
playNote(xxx, yyy);

  // The recursive function
function playNote(theId, theTime)
{
    // Do whatever has to be done
    // ...

    // Have the function call itself again after a delay, if necessary
    //   you can modify the arguments that you use here. As an
    //   example I add 20 to theTime each time. You can also modify
    //   the delay. I add 1/2 a second to the delay each time as an example.
    //   You can use a condition to continue or stop the recursion

    delay += 500;

    if (condition)
    { setTimeout(function() { playNote(theID, theTime + 20) }, delay); }
}

More Related Contents:

  1. Why is set.timeout not working in this php while loop?
  2. Why the timer setTimeout returns the first value “2”
  3. Pass correct “this” context to setTimeout callback?
  4. Combination of async function + await + setTimeout
  5. setTimeout calls function immediately instead of after delay
  6. Difference between setTimeout with and without quotes and parentheses
  7. Why is my function call that should be scheduled by setTimeout executed immediately? [duplicate]
  8. Execute script after specific delay using JavaScript
  9. What is the reason JavaScript setTimeout is so inaccurate?
  10. Using setTimeout on promise chain
  11. React hooks – right way to clear timeouts and intervals
  12. JavaScript : For loop with timeout
  13. Passing functions to setTimeout in a loop: always the last value?
  14. How to stop a setTimeout loop?
  15. JavaScript setTimeout() won’t wait to Execute? [duplicate]
  16. Javascript SetTimeout and Loops [duplicate]
  17. How to make `setInterval` behave more in sync, or how to use `setTimeout` instead?
  18. setTimeout() is not waiting [duplicate]
  19. Is there a faster way to yield to Javascript event loop than setTimeout(0)?
  20. Will setInterval cause browsers to hang?
  21. What happens to setTimeout when the computer goes to sleep?
  22. setTimeout behaviour with blocking code
  23. How to tell .hover() to wait?
  24. stop settimeout in recursive function
  25. Why doesn’t setTimeout(.., 0) execute immediately?
  26. Is it possible to chain setTimeout functions in JavaScript?
  27. Global variable is logged as undefined when passed as parameter to setTimeout callback function
  28. How browser executes Javascript and renders asynchronously
  29. setTimeout Internet Explorer
  30. setTimeout() method inside a while loop [duplicate]

Leave a Comment