В този урок ще научите за метода JavaScript setTimeout () с помощта на примери.
В setTimeout()
метода изпълнява блок от код след определено време. Методът изпълнява кода само веднъж.
Често използваният синтаксис на JavaScript setTimeout е:
setTimeout(function, milliseconds);
Неговите параметри са:
- функция - функция, съдържаща блок код
- милисекунди - времето, след което функцията се изпълнява
В setTimeout()
метода връща intervalID , което е положително цяло число.
Пример 1: Показване на текст веднъж след 3 секунди
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) setTimeout(greet, 3000); console.log('This message is shown first');
Изход
Това съобщение се показва първо Hello world
В горната програма setTimeout()
методът извиква greet()
функцията след 3000 милисекунди ( 3 секунди).
Следователно програмата показва текста Hello world само веднъж след 3 секунди.
Забележка : setTimeout()
Методът е полезен, когато искате да изпълните блок от веднъж след известно време. Например показване на съобщение на потребител след посоченото време.
В setTimeout()
метода връща интервал ID. Например,
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) let intervalId = setTimeout(greet, 3000); console.log('Id: ' + intervalId);
Изход
Id: 3 Здравей, свят
Пример 2: Показване на време на всеки 3 секунди
// 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();
Изход
17:45:39 17:45:43 17:45:47 17:45:50 …
Горната програма показва времето на всеки 3 секунди.
В setTimeout()
метода нарича функция само веднъж след интервал от време (в случая 3 секунди).
Въпреки това, в горната програма, тъй като функцията се извиква, програмата показва времето на всеки 3 секунди.
Тази програма работи за неопределено време (до изчерпване на паметта).
Забележка : Ако трябва да изпълните функция няколко пъти, по-добре е да използвате setInterval()
метода.
JavaScript clearTimeout ()
Както видяхте в горния пример, програмата изпълнява блок от код след посочения интервал от време. Ако искате да спрете извикването на тази функция, можете да използвате clearTimeout()
метода.
Синтаксисът на clearTimeout()
метода е:
clearTimeout(intervalID);
Тук, intervalID
е връщаната стойност на setTimeout()
метода.
Пример 3: Използвайте метода clearTimeout ()
// 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.');
Изход
setTimeout е спрян.
В горната програма setTimeout()
методът се използва за увеличаване на стойността на броя след 3 секунди. Обаче clearTimeout()
методът спира извикването на функцията на setTimeout()
метода. Следователно стойността на броя не се увеличава.
Забележка : Обикновено използвате clearTimeout()
метода, когато трябва да отмените setTimeout()
извикването на метода, преди да се случи.
Можете също да предадете допълнителни аргументи на setTimeout()
метода. Синтаксисът е:
setTimeout(function, milliseconds, parameter1,… .paramenterN);
Когато предадете допълнителни параметри на setTimeout()
метода, тези параметри ( parameter1
, parameter2
и т.н.) ще бъдат предадени на посочената функция .
Например,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setTimeout setTimeout(greet, 1000, 'John', 'Doe');
Изход
Здравей Джон Доу
В горната програма два параметъра John
и Doe
се предават на setTimeout()
метода. Тези два параметъра са аргументите, които ще бъдат предадени на функцията (тук, greet()
функция), която е дефинирана вътре в setTimeout()
метода.
Препоръчително четене: JavaScript async () и await ()