Tässä opetusohjelmassa opit JavaScript setTimeout () -metodista esimerkkien avulla.
setTimeout()
Menetelmä suorittaa koodiosion jälkeen tietyn ajan. Menetelmä suorittaa koodin vain kerran.
JavaScript setTimeoutin yleisesti käytetty syntaksi on:
setTimeout(function, milliseconds);
Sen parametrit ovat:
- function - toiminto, joka sisältää koodilohkon
- millisekuntia - aika, jonka jälkeen toiminto suoritetaan
setTimeout()
Menetelmä palauttaa intervalID , joka on positiivinen kokonaisluku.
Esimerkki 1: Näytä teksti kerran 3 sekunnin kuluttua
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) setTimeout(greet, 3000); console.log('This message is shown first');
Tuotos
Tämä viesti näytetään ensin Hello world
Yllä olevassa ohjelmassa setTimeout()
menetelmä kutsuu greet()
funktion 3000 millisekunnin ( 3 sekunnin) kuluttua .
Siksi ohjelma näyttää tekstin Hei maailma vain kerran 3 sekunnin kuluttua.
Huomautus : setTimeout()
Menetelmä on hyödyllinen, kun haluat suorittaa lohkon kerran jonkin ajan kuluttua. Esimerkiksi viestin näyttäminen käyttäjälle määritetyn ajan kuluttua.
setTimeout()
Menetelmä palauttaa aikaväli id. Esimerkiksi,
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) let intervalId = setTimeout(greet, 3000); console.log('Id: ' + intervalId);
Tuotos
Id: 3 Hei maailma
Esimerkki 2: Näyttöaika 3 sekunnin välein
// program to display time every 3 seconds function showTime() ( // return new date and time let dateTime= new Date(); // returns the current local time let time = dateTime.toLocaleTimeString(); console.log(time) // display the time after 3 seconds setTimeout(showTime, 3000); ) // calling the function showTime();
Tuotos
17:45:39 5:45:43 PM 17:45:47 17:45:50 PM…
Yllä oleva ohjelma näyttää ajan 3 sekunnin välein.
setTimeout()
Menetelmä kutsuu funktiota vain kerran sen jälkeen, kun aikaväli (tässä 3 sekuntia).
Koska toiminto kuitenkin kutsuu itseään yllä olevassa ohjelmassa, ohjelma näyttää ajan 3 sekunnin välein.
Tämä ohjelma toimii toistaiseksi (kunnes muisti loppuu).
Huomaa : Jos haluat suorittaa toiminnon useita kertoja, on parempi käyttää setInterval()
menetelmää.
JavaScript clearTimeout ()
Kuten yllä olevasta esimerkistä näet, ohjelma suorittaa koodilohkon määritetyn aikavälin jälkeen. Jos haluat lopettaa tämän toimintopuhelun, voit käyttää clearTimeout()
menetelmää.
Menetelmän syntaksi clearTimeout()
on:
clearTimeout(intervalID);
Tässä intervalID
on setTimeout()
menetelmän paluuarvo .
Esimerkki 3: Käytä clearTimeout () -menetelmää
// program to stop the setTimeout() method let count = 0; // function creation function increaseCount()( // increasing the count by 1 count += 1; console.log(count) ) let id = setTimeout(increaseCount, 3000); // clearTimeout clearTimeout(id); console.log('setTimeout is stopped.');
Tuotos
setTimeout on pysäytetty.
In the above program, the setTimeout()
method is used to increase the value of count after 3 seconds. However, the clearTimeout()
method stops the function call of the setTimeout()
method. Hence, the count value is not increased.
Note: You generally use the clearTimeout()
method when you need to cancel the setTimeout()
method call before it happens.
You can also pass additional arguments to the setTimeout()
method. The syntax is:
setTimeout(function, milliseconds, parameter1,… .paramenterN);
When you pass additional parameters to the setTimeout()
method, these parameters (parameter1
, parameter2
, etc.) will be passed to the specified function.
For example,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setTimeout setTimeout(greet, 1000, 'John', 'Doe');
Output
Hello John Doe
Edellä olevassa ohjelmassa kaksi parametria John
ja Doe
ne välitetään setTimeout()
menetelmälle. Nämä kaksi parametria ovat argumentit, jotka välitetään funktiolle (tässä, greet()
funktio), joka on määritelty setTimeout()
menetelmän sisällä .
Suositeltava lukeminen: JavaScript async () and wait ()