Javascript setTimeout ()

Innehållsförteckning

I den här handledningen lär du dig metoden JavaScript setTimeout () med hjälp av exempel.

Den setTimeout()metod utför ett block av kod efter den angivna tiden. Metoden kör koden bara en gång.

Den vanligaste syntaxen för JavaScript setTimeout är:

 setTimeout(function, milliseconds);

Dess parametrar är:

  • funktion - en funktion som innehåller ett kodblock
  • millisekunder - den tid efter vilken funktionen körs

Den setTimeout()metod returnerar ett intervalID , vilket är ett positivt heltal.

Exempel 1: Visa en text en gång efter 3 sekunder

 // program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) setTimeout(greet, 3000); console.log('This message is shown first');

Produktion

Detta meddelande visas först  Hello world

I ovanstående program setTimeout()kallar metoden greet()funktionen efter 3000 millisekunder ( 3 sekunder).

Programmet visar därför texten Hello world bara en gång efter 3 sekunder.

Obs : Den setTimeout()metoden är användbar när du vill köra ett block av en gång efter en viss tid. Till exempel visar ett meddelande till en användare efter den angivna tiden.

Den setTimeout()metoden returnerar intervallet id. Till exempel,

 // program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) let intervalId = setTimeout(greet, 3000); console.log('Id: ' + intervalId); 

Produktion

 Id: 3 Hej värld

Exempel 2: Visningstid var tredje sekund

 // 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();

Produktion

 17:45:39 17:45:43 17:45:47 17:45:50 … 

Ovanstående program visar tiden var 3 sekunder.

Den setTimeout()metoden anropar funktionen endast en gång efter tidsintervallet (här 3 sekunder).

I ovanstående program, eftersom funktionen kallar sig, visar programmet tiden var 3 sekunder.

Detta program körs på obestämd tid (tills minnet tar slut).

Obs! Om du behöver utföra en funktion flera gånger är det bättre att använda setInterval()metoden.

JavaScript clearTimeout ()

Som du har sett i exemplet ovan kör programmet ett kodblock efter det angivna tidsintervallet. Om du vill stoppa detta funktionssamtal kan du använda clearTimeout()metoden.

Syntaxen för clearTimeout()metoden är:

 clearTimeout(intervalID);

Här intervalIDär setTimeout()metodens returvärde .

Exempel 3: Använd clearTimeout () -metoden

 // 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.');

Produktion

 setTimeout stoppas.

I ovanstående program används setTimeout()metoden för att öka räknarvärdet efter 3 sekunder. Men clearTimeout()slutar metoden funktionsanrop av setTimeout()metoden. Följaktligen ökas inte räknevärdet.

Obs! Du använder vanligtvis clearTimeout()metoden när du behöver avbryta setTimeout()metodanropet innan det händer.

Du kan också skicka ytterligare argument till setTimeout()metoden. Syntaksen är:

 setTimeout(function, milliseconds, parameter1,… .paramenterN);

När du passerar ytterligare parametrar till setTimeout()metoden, dessa parametrar ( parameter1, parameter2kommer etc.) ska skickas till den angivna funktionen .

Till exempel,

 // program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setTimeout setTimeout(greet, 1000, 'John', 'Doe');

Produktion

 Hej John Doe

I ovanstående program, två parametrar Johnoch Doeskickas till setTimeout()metoden. Dessa två parametrar är argumenten som kommer att skickas till funktionen (här, greet()funktion) som definieras i setTimeout()metoden.

Rekommenderad läsning: JavaScript async () och väntar ()

Intressanta artiklar...