В този урок ще научите за метода JavaScript setInterval () с помощта на примери.
В JavaScript блок код може да бъде изпълнен за определени интервали от време. Тези интервали от време се наричат времеви събития.
Има два метода за изпълнение на код на определени интервали. Те са:
- setInterval ()
- setTimeout ()
В този урок ще научите за setInterval()
метода.
JavaScript setInterval ()
В setInterval()
метода повтаря блок на код на всеки даден момент събитие.
Често използваният синтаксис на JavaScript setInterval е:
setInterval(function, milliseconds);
Неговите параметри са:
- функция - функция, съдържаща блок код
- милисекунди - интервалът от време между изпълнението на функцията
В setInterval()
метода връща intervalID което е положително цяло число.
Пример 1: Показване на текст веднъж на 1 секунда
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Изход
Hello world Hello world Hello world Hello world Hello world ….
В горната програма setInterval()
методът извиква greet()
функцията на всеки 1000 милисекунди ( 1 секунда).
Следователно програмата показва текста Hello Hello веднъж на 1 секунда.
Забележка : setInterval()
Методът е полезен, когато искате да повторите блок от код няколко пъти. Например показване на съобщение на фиксиран интервал.
Пример 2: Време на показване на всеки 5 секунди
// program to display time every 5 seconds function showTime() ( // return new date and time let dateTime= new Date(); // return the time let time = dateTime.toLocaleTimeString(); console.log(time) ) let display = setInterval(showTime, 5000);
Изход
"17:15:28 PM" "17:15:33 PM" "17:15:38 PM" …
Горната програма показва текущото време веднъж на всеки 5 секунди.
new Date()
дава текущата дата и час. И toLocaleTimeString()
връща текущото време. За да научите повече за датата и часа, посетете JavaScript и дата и час.
JavaScript clearInterval ()
Както видяхте в горния пример, програмата изпълнява блок код на всеки определен интервал от време. Ако искате да спрете това извикване на функция, тогава можете да използвате clearInterval()
метода.
Синтаксисът на clearInterval()
метода е:
clearInterval(intervalID);
Тук, intervalID
е връщаната стойност на setInterval()
метода.
Пример 3: Използвайте метода clearInterval ()
// program to stop the setInterval() method after five times let count = 0; // function creation let interval = setInterval(function()( // increasing the count by 1 count += 1; // when count equals to 5, stop the function if(count === 5)( clearInterval(interval); ) // display the current time let dateTime= new Date(); let time = dateTime.toLocaleTimeString(); console.log(time); ), 2000);
Изход
16:47:41 16:47:43 16:47:45 16:47:47 16:47:49
В горната програма setInterval()
методът се използва за показване на текущото време на всеки 2 секунди. В clearInterval()
метода спира извикването на функция след 5 пъти.
Можете също да предадете допълнителни аргументи на setInterval()
метода. Синтаксисът е:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Когато предадете допълнителни параметри на setInterval()
метода, тези параметри ( parameter1
, parameter2
и т.н.) ще бъдат предадени на посочената функция .
Например,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Изход
Здравей Джон Доу Здравей Джон Доу Здравей Джон Доу ….
В горната програма два параметъра John
и Doe
се предават на setInterval()
метода. Тези два параметъра са аргументите, които ще бъдат предадени на функцията (тук, greet()
функция), която е дефинирана вътре в setInterval()
метода.
Забележка: Ако трябва да изпълните функция само веднъж, по-добре е да използвате метода setTimeout ().