How to Use setInterval in JavaScript

Use setInterval() when code should run repeatedly at a fixed time interval. This is ideal for clocks, polling, rotating banners, countdowns, and live dashboards.

What you’ll build or solve

You’ll learn how to use setInterval in JavaScript with repeated callbacks and safe cleanup. You’ll also know how to stop intervals when they are no longer needed.

When this approach works best

This approach is the right choice when an action should repeat continuously after the same delay.

Common real-world scenarios include:

• Digital clocks
• Polling APIs
• Countdown timers
• Slideshow rotation
• Live metrics refresh

This is a bad idea when the action should run only once after a delay. In that case, use setTimeout().

Prerequisites

You only need:

• A JavaScript file or browser console
• Basic functions knowledge

Step-by-step instructions

Step 1: Pass a callback and interval delay

The first argument is the callback, and the second is the repeat delay in milliseconds.

setInterval(() => {
  console.log("Runs every second");
}, 1000);

The callback keeps repeating until the page closes or the interval is cleared.

Store the interval ID when it needs to stop later.

const intervalId = setInterval(() => {
  console.log("Polling...");
}, 2000);

Use clearInterval() to stop it.

clearInterval(intervalId);

What to look for:

• Delay uses milliseconds
• The callback repeats continuously
• Store the interval ID for cleanup
• Great for timers and polling
• Always stop unused intervals

Examples you can copy

Digital clock

setInterval(() => {
  clock.textContent = new Date().toLocaleTimeString();
}, 1000);

Poll API

const poller = setInterval(() => {
  fetchData();
}, 5000);

Countdown

const timer = setInterval(() => {
  seconds--;
}, 1000);

Common mistakes and how to fix them

Mistake 1: Calling the callback immediately

What the reader might do:

setInterval(updateClock(), 1000);

Why it breaks: the function runs immediately instead of repeating on the timer.

Corrected approach:

setInterval(updateClock, 1000);

Mistake 2: Forgetting to clear old intervals

What the reader might do:

button.addEventListener("click", () => {
  setInterval(runTimer, 1000);
});

Why it breaks: repeated clicks create stacked intervals.

Corrected approach:

Store the interval ID and clear it before starting a new one.

Mistake 3: Using it for one-time delays

What the reader might do:

setInterval(showAlert, 3000);

Why it breaks: the alert keeps repeating forever.

Corrected approach:

Use setTimeout() for one delayed action.

Troubleshooting

If the callback fires immediately, remove the parentheses.

If repeated clicks speed up the timer, clear old intervals first.

If the delay feels wrong, convert seconds to milliseconds.

If repetition is not needed, switch to setTimeout().

Quick recap

• Use setInterval() for repeated actions
• Pass a callback reference
• Delay uses milliseconds
• Store the interval ID
• Stop unused intervals with clearInterval()