Javascript setTimeout ()

Sisällysluettelo

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ä intervalIDon 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 Johnja Doene 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 ()

Mielenkiintoisia artikkeleita...