JavaScript Program to Pass Parameter to a setTimeout() Method

In this article, we will discuss how to pass parameters to the setTimeout() method in JavaScript. The setTimeout() method is used to delay the execution of a piece of code. This method executes a function, after waiting a specified number of milliseconds. We have different approaches to passing parameters to the setTimeout() method.

There are several approaches to pass parameters to the setTimeout() function, which are listed below:

We will explore every approach to Pass a Parameter to a setTimeout() Function, along with understanding their basic implementations.

Approach 1: Using an Anonymous Function

One way to pass parameters to the setTimeout() function is by using an anonymous function as the callback. Inside the anonymous function, we can invoke the desired function with the necessary parameters.

Syntax:

setTimeout(function (param1, param2) {
// Code to be executed after the delay
}, delay);

Example: In this example, we will pass parameters to the setTimeout() function using an anonymous function.

Javascript




setTimeout(function (param1, param2) {
    console.log(param1 + ' ' + param2);
}, 1000, 'Hello', 'Beginner');


Output: After a 1-second delay.

Hello Beginner

Approach 2: Using Arrow Function

ES6 introduced arrow function syntax, which provides a concise way to define functions. We can leverage arrow functions to pass parameters to the setTimeout() function.

Syntax:

setTimeout((param1, param2) => {
// Code to be executed after the delay
}, delay, arg1, arg2);

Example: In this example, we will pass parameters to the setTimeout() function using arrow function syntax.

Javascript




setTimeout((parameter) => {
    console.log(parameter);
}, 1000, "w3wiki");


Output: After a 1-second delay.

w3wiki

Approach 3: Using a bind() Method

We may need to pass parameters to a method of an object. We can achieve this by creating a bound function using the bind() method and passing it as the callback to the setTimeout() function.

Syntax:

setTimeout(object.method.bind(object, parameter1, parameter2), delay);

Example: In this example, we will pass parameters to the setTimeout() function using a bound function.

Javascript




const data = {
    name: "w3wiki",
    greet: function (message) {
        console.log(message + ", " + this.name + "!");
    }
};
  
setTimeout(data.greet.bind(data, "Hello"), 1000);


Output: After a 1-second delay.

Hello, w3wiki!

Approach 4: Using Spread Operator

Using ES6 spread syntax, allows passing parameters to setTimeout() using an array-like structure for variable parameter count.

Syntax:

setTimeout(function (...args) {
const [param1, param2] = args;
// Code to execute after the timeout
// using param1 and param2
}, delay, arg1, arg2);

Example: Here is an example of using the spread operator.

Javascript




setTimeout((message) => {
    console.log(message);
}, 2000, ...["Hello, Beginner"]);


Output: After a 2-second delay.

Hello, Beginner

Approach 5: Using Named Function

Using a named function allows passing parameters to setTimeout() by defining a separate function that receives the parameters and is executed after the timeout.

Syntax:

function functionName(){
// Code here
}

Example: In this example, we are using the above-explained approach.

Javascript




function myFunction(message) {
    console.log(message);
}
  
setTimeout(myFunction, 1000, "Hello,Beginner !");


Output: After a 1-second delay.

Hello,Beginner !

Approach 6: Using Closure Function

A closure is a feature of JavaScript that allows inner functions to access the outer scope of a function.

Syntax:

function myFunction(param1, param2) {
return function () {
// Code to execute
};
}

Example: In this example, The myFunction creates a closure that logs ‘Hello w3wiki’ after a 1-second delay using the provided parameters.

Javascript




function myFunction(param1, param2) {
    return function () {
        // Code to execute after the timeout 
        //using param1 and param2
        console.log(param1 + ' ' + param2);
    };
}
  
let result = myFunction('Hello', 'w3wiki');
setTimeout(result, 1000);


Output: After a 1-second delay.

Hello w3wiki


Contact Us