DEV Community

Cover image for -SetTimeOut , SetInterval
Husniddin6939
Husniddin6939

Posted on

-SetTimeOut , SetInterval

setTimeOut - it call to function and execute our codes after a few menutes.

Additionally setTimeOut accepts these values

Image description

                         How it works ?
Enter fullscreen mode Exit fullscreen mode
setTimeOut(()=>{console.log("Hello khusi")}, 8000);
Enter fullscreen mode Exit fullscreen mode

and result showed after 8 secound.

Image description.
We can type the third value as so.

setTimeout((text)=>{console.log("Hello khusi"+ text)}, 8000, "program");

Enter fullscreen mode Exit fullscreen mode

and it demonstrate

Image description

setInterval - it works during the time that we add.

Secondly, setInterval take this kind of properties.

Image description

                      How does it work ?
Enter fullscreen mode Exit fullscreen mode
"use-strict";

let btn=document.getElementById('start');
let timeText=document.getElementById('time');
let stopbtn=document.getElementById('stop')

let timer=0;

let timeCount=setInterval(()=>{
    timeText.innerHTML=`${timer}`;
    timer++;

}, 1000);

btn.addEventListener('click',()=>{
    setInterval(()=>{
        timeText.innerHTML=`${timer}`;
        timer++;

    }, 1000);

});

stopbtn.addEventListener('click', ()=>{
    clearInterval(timeCount)
})
Enter fullscreen mode Exit fullscreen mode

Firstly it started to count automatically

Image description
then we stop it with stop button by clicking

Image description

after that we again start to continue by clicking start button

Image description

Top comments (0)