Reader Level:
ARTICLE

Calling Function With Timer in JavaScript

Posted by Ankur Mishra Articles | JavaScript August 08, 2013
In JavaScript the timer is a very important feature, it allows us to execute a JavaScript function after a specified period, thereby making it possible to add a new dimension, time, to our website.
  • 0
  • 0
  • 4337

In JavaScript the timer is a very important feature, it allows us to execute a JavaScript function after a specified period, thereby making it possible to add a new dimension, time, to our website. With the help of the timer, we can run a command at specified intervals, run loops repeatedly at a predefined time, and synchronize multiple events in a particular time span.

There are various methods for using it as in the following:

Calling-Function-with-Timer-in-JavaScript-1.jpg
 
1. The setTimeout() method: Executes code at a specified interval. The syntax for this is:

setTimeout(function, delayTime)


In the preceding syntax the setTimeout() method contains two parameters, function and delayTime. The function parameter specifies the method that the timer calls and the delayTime parameter specifies the number of milliseconds to wait before calling the method.

Example : Let's try with an example, this method is useful for delaying the execution of a particular code.  Let's write the code as in the following:

Calling-Function-with-Timer-in-JavaScript-2.jpg

The setTimeout("alert('Hi, Welcome! Ankur Here.')", 5000) method creates a timed alert box. The first parameter of the setTimeout() method is a string that contains a JavaScript statement, alert('Hi, Welcome! Ankur Here.'), and second parameter , 5000 , specifies the time in milliseconds after which the first parameter will execute.

So the output of this code will be:

Calling-Function-with-Timer-in-JavaScript-3.jpg

2. The clearTimeout() method: Deactivates or cancels the timer that is set using the setTime() method. The syntax for this is:

clearTimeout(timer)

In the preceding syntax, timer is a variable that is created using the setTimeout() method.
 
3. The setInterval() method: Executes a function after a specified time interval. The syntax for this is:

setInterval(function, intervalTime)

In the syntax above, setInterval() is the method with two parameters, function and intervalTime. The function parameters specifies the method to be called; whereas, the intervalTime parameter specifies the time interval between the function calls.
 
Example: Let's try with an example, this method executes the code after every specified time interval.  Let's write the code as in the following:

Calling-Function-with-Timer-in-JavaScript-4.jpg

In the given code, the setInterval() method creates a timer that calls the alert() method repeatedly. In the setInterval() method, the first parameter is a string that contains a JavScript statement, alert('Sorry ! 1 seconds.'). The second parameter specifies the time in milliseconds,
1000, after which the first parameter is displayed.

So the output of this code will be:

Calling-Function-with-Timer-in-JavaScript-5.jpg

4. The clearInterval() method: Deactivates or cancels the timer that is set using the setInterval() method. The syntax for this is:

clearInterval(timer)

The preceding syntax deactivates the inner timer variable that is created using the setInterval() method.

So enjoy and work with the Timer in JavaScript.

COMMENT USING

Trending up