JavaScript Asynchronous

JavaScript setTimeout

Written by Swapnil RajaPublished 24 Aug 2026

setTimeout runs a function once after a delay.

The delay is in milliseconds, so 1000 is one second.

It returns an id you can use to cancel it.

Example

javascript

setTimeout(function () {
  console.log("done");
}, 10);

The message appears after ten milliseconds.

What is setTimeout?

setTimeout schedules a function to run once, later.

The delay is a minimum, not a promise - the function runs when the thread is free.

clearTimeout cancels it before it fires.

Syntax

javascript

const id = setTimeout(handler, delay);
clearTimeout(id);

Pass the function without brackets.

Cancelling a Timer

clearTimeout stops it from ever running.

Example

javascript

const id = setTimeout(function () {
  console.log("this never runs");
}, 10);

clearTimeout(id);

console.log("cancelled");

Only cancelled is printed.

Passing Arguments

Anything after the delay is handed to the function.

Example

javascript

setTimeout(function (name) {
  console.log("hello " + name);
}, 10, "Ada");

The output is hello Ada.

A Delay of Zero Still Waits

Even 0 means after the current code has finished.

The callback joins the queue rather than jumping in.

Example

javascript

setTimeout(function () {
  console.log("second");
}, 0);

console.log("first");

The output is first then second.

The Brackets Mistake

Adding brackets calls the function immediately.

The timer then schedules whatever it returned, which is usually nothing.

Example

javascript

function announce() {
  console.log("announced");
}

setTimeout(announce, 10);

Writing announce() here would print straight away instead.

Timers Are Not Exact

The delay is the earliest the callback can run, not the exact moment.

Busy code can push it back.

Example

javascript

const started = Date.now();

setTimeout(function () {
  const waited = Date.now() - started;
  console.log(waited >= 20 ? "waited at least 20ms" : "fired too early");
}, 20);

It never fires early, but it can easily be late.

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript setTimeout</title>
</head>
<body>

  <h1>setTimeout</h1>

  <p id="out">Waiting...</p>
  <button id="cancel">Cancel</button>

  <script>
    const out = document.getElementById("out");

    const id = setTimeout(function () {
      out.textContent = "Two seconds have passed";
    }, 2000);

    document.getElementById("cancel").addEventListener("click", function () {
      clearTimeout(id);
      out.textContent = "Cancelled";
    });
  </script>

</body>
</html>

Try It Yourself

Run the above example in the Try It Editor.

Try cancelling in time:

Click the button before two seconds and the first message never appears.

Important Points

setTimeout runs a function once after a delay.
The delay is in milliseconds.
It returns an id for clearTimeout.
Extra arguments after the delay are passed to the function.
The delay is a minimum, not an exact time.

Conclusion

setTimeout is the simplest piece of asynchronous JavaScript.

It is worth understanding well, because promises behave the same way about ordering.

Remember to keep the id if there is any chance you will want to cancel.

PreviousJavaScript Asynchronous NextJavaScript setInterval