У цьому посібнику ви дізнаєтесь про метод JavaScript setInterval () за допомогою прикладів.
У JavaScript блок коду може бути виконаний через визначені інтервали часу. Ці інтервали часу називаються подіями хронометражу.
Існує два методи для виконання коду через певні проміжки часу. Вони є:
- setInterval ()
- setTimeout ()
У цьому посібнику ви дізнаєтесь про setInterval()метод.
JavaScript setInterval ()
setInterval()Метод повторює блок коду в кожному даному випадку синхронізації.
Загальновживаним синтаксисом JavaScript setInterval є:
setInterval(function, milliseconds);
Його параметри:
- function - функція, що містить блок коду
- мілісекунди - інтервал часу між виконанням функції
setInterval()Метод повертає intervalID , який являє собою позитивне ціле число.
Приклад 1: Показуйте текст раз на 1 секунду
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Вихідні дані
Привіт світ Привіт світ Привіт світ Привіт світ Привіт світ ….
У наведеній вище програмі setInterval()метод викликає greet()функцію кожні 1000 мілісекунд ( 1 секунда).
Отже, програма відображає текст Hello world раз на 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 ().
