setTimeout() in JavaScript (original) (raw)

Last Updated : 29 Nov, 2024

The **setTimeout() function is used to add delay or scheduling the execution of a specific function after a certain period. It's a key feature of both browser environments and Node.js, enabling asynchronous behavior in code execution.

JavaScript `

setTimeout(function() { console.log('Hello, world!'); }, 2000);

`

**Output

Hello, world!

**Syntax

setTimeout(function, delay, arg1, arg2, ...);

Parameters

• **function: After the specified time period, this is the function that is executed.
• **milliseconds: The delay time is expressed in milliseconds.
• **arg1, **arg2, ...: If needed, these are the optional parameters.

**1. Cancellation the setTimeout() Function

JavaScript provides a corresponding function called clearTimeout() to cancel a scheduled timeout before it gets executed.

JavaScript `

function delayedFunction() { console.log("This won't be executed due to clearTimeout"); }

let timeoutId = setTimeout(delayedFunction, 2000);

// Cancel the setTimeout before it executes clearTimeout(timeoutId);

console.log("Timeout canceled");

`

**2. Purpose of setTimeout() Function

The setTimeout() function is utilized to introduce a delay or to execute a particular function after a specified amount of time has passed. It is part of the Web APIs provided by browsers and Node.js, allowing asynchronous execution of code.

JavaScript `

console.log("Start");

setTimeout(function() { console.log("Delayed log after 2000 milliseconds"); }, 2000);

console.log("End");

`

**Output

Start End Delayed log after 2000 milliseconds

**Explanation

• The setTimeout() function takes two parameters: a callback function and a time delay in milliseconds.
• In the example, after the initial "Start" and "End" logs, the setTimeout() is set to execute the callback function (delayed log) after 2000 milliseconds (2 seconds).
• The rest of the code continues executing without waiting for the delay, demonstrating the asynchronous nature of setTimeout().
• After the specified delay, the callback function is invoked, resulting in the "Delayed log after 2000 milliseconds" message being logged to the console.

**Use Cases

• **Delaying Execution: It can be used to introduce delays in code execution, useful for scenarios like animations, timed events, or deferred operations.
• **Asynchronous Operations: When combined with callback functions, it facilitates asynchronous behavior, enabling non-blocking code execution.
• **Timeouts in Web Development: It's commonly employed in web development for handling timeouts, such as showing a notification after a certain time or refreshing content.