Suppose you need to delay the execution of a certain part of your code, you can use the
setInterval() functions for that.
The process of delaying the execution of the function is called Scheduling in js.
In JS there are 2 methods to delay:
Note:- Nested setTimout is more flexible and can be used in place of setInterval.
The setTimeout method delays the execution of the code for the particular time passed as the argument to it.
The first argument is the function name to be executed, it is not recommended to place the actual code here.
The second argument is the delay time in milliseconds by default it is 0.
Note:- 1 second = 1000 ms.
arg1, arg2, arg3 …
Arguments to be passed to the function, are optional.
In the following code, suppose we want to display a message after 3 seconds.
For instance, this code calls
showMsg() after 3 seconds.
So, after 3 seconds the above code will output the message in the console.
You can also use setTimout with the arguments as below.
The above code will execute after 2 seconds with the arguments.
So, this will also work:
But using strings is not recommended, use arrow functions instead of them, like this:
In some situations, you may need to stop the delayed function set by setTimout by using the
Suppose you have a function named
The syntax to cancel the setTimout function timerFunc is:
Therefore, the above function will not execute.
Zero delay setTimeout
There is a special use case of setTimout method, suppose you may need to execute a block of code after the execution of the current js script.
The above two functions schedule the execution of funcName as soon as possible and execute it only after the currently executing script.
Also Read: Format Js Strings
The setInterval method is also used to delay the code execution but it runs the function regularly after the given interval of time not only once.
The syntax of the
setInterval method is the same as the
All the arguments have the same meaning as the setTimout method.
The only difference is that setTimout runs only once, and setInterval runs repeatedly for the given interval of time.
To stop further calls, we should call clearInterval(timerFunc) same as clearTimout.
Suppose you need to show a message after every 2 seconds and stop it after 10 seconds.
The following code will show the message every 2 seconds, And after 6 seconds, the output is stopped.
Or, you can use the arrow function as below.
Now, to stop the code after 10 seconds use
- One is setInterval
- Second is Nested setTimout
You can use nested setTimout functions instead of the setInterval function for optimization purposes.
The main benefit of the above code is that it schedules the next call right at the end of the current one.
The nested setTimeout is a more flexible method than setInterval.
This way the next call may be scheduled differently, depending on the results of the current one.
Let us say your program (API) needs to fetch the new data from the server after every 10 seconds, and the server is already overloaded.
Then you need to increase the interval time to fetch the data such as 10, 20, …, or 50 seconds.
So if the server is overloaded our program will increase the interval time from 10 to 20 seconds, and from 20 to 40 seconds.
Also Read: Create Nested Lists In JS
The setTimout method delays the code execution for a specific time and the setInterval method also delays the code but it runs the code repeatedly until explicitly stopped.