ฟังก์ชัน setInterval ในภาษา JavaScript

ฟังก์ชัน setInterval ใช้เพื่อกำหนดให้โปรแกรมทำงานเป็นระยะจากช่วงเวลาที่กำหนด ยกตัวอย่างเช่น เราสามารถใช้มันเพื่อกำหนดให้โปรแกรมทำงานบางอย่างในทุก 5 วินาทีหรือในทุกๆ 1 นาทีได้ นี่เป็นรูปแบบการใช้งานของฟังก์ชัน setInterval ในภาษา JavaScript

timerId = setInterval(callback, delay);

ในรูปแบบการใช้งาน พารามิเตอร์แรกจะเป็นฟังก์ชัน callback ที่จะถูกเรียกใช้งานในทุกๆ delay มิลลิวินาที ฟังก์ชันส่งค่ากลับเป็น Timer ID ที่เราสามารถใช้สำหรับยกเลิกการทำงานของมันได้ ในตัวอย่างนี้ เป็นโปรแกรมแสดงการนับตัวเลขที่จะเพิ่มขึ้นในทุกๆ 1 วินาที

let count = 1;
setInterval(() => {
    console.log(count);
    count++;
}, 1000);

นี่เป็นผลลัพธ์การทำงานของโปรแกรม

1
2
3
4
5
...

โปรแกรมนี้จะรันไปเรื่อยๆ โดยที่ไม่รู้จบเนื่องจากฟังก์ชัน setInterval จะทำงานตลอดไปในทุกๆ 1 วินาทีที่กำหนดเป็นเวลาหน่วงให้กับฟังก์ชัน คุณสามารถหยุดการทำงานของโปรแกรมได้ด้วยการกดปุ่ม CTRL+C บนคีย์บอร์ด

ในการใช้งานฟังก์ชัน setInterval เราสามารถยกเลิกการทำงานของมันได้โดยใช้ฟังก์ชัน clearInterval กับ Timer ID ที่ได้รับในตอนสร้าง นี่เป็นตัวอย่างของโปรแกรมนับถอยหลังที่จะหยุดนับเมื่อเวลาเป็น 0

let count = 5;

let timerId = setInterval(() => {
    console.log(count);
    count--;

    if (count == 0) {
        console.log('Done');
        clearInterval(timerId);
    }
}, 1000);

นี่เป็นผลลัพธ์การทำงานของโปรแกรม

5
4
3
2
1
Done

ในตัวอย่างนี้ เป็นโปรแกรมแสดงนาฬิกานับถอยหลังโดยใช้ฟังก์ชัน setInterval เพื่อลดค่าตัวเลขในตัวแปรลงในทุกๆ 1 วินาที ทุกครั้งที่โปรแกรมมีการลดค่าลง เราได้ตรวจสอบค่าในตัวแปร count ว่ามันเท่ากับ 0 หรือไม่

if (count == 0) {
    console.log('Done');
    clearInterval(timerId);
}

ถ้าหากเงื่อนไขเป็นจริง นั่นคือตัวแปร count มีค่าเท่ากับ 0 เราแสดงข้อความว่า "Done" และใช้ฟังก์ชัน clearInterval เพื่อยกเลิกการทำงานของฟังก์ชัน setInterval ในรอบถัดไป

ในบทนี้ คุณได้เรียนรู้การใช้งานฟังก์ชัน setInterval เพื่อกำหนดเวลาให้โปรแกรมทำงานเป็นระยะจากช่วงเวลาที่กำหนด และการใช้ฟังก์ชัน clearInterval เพื่อยกเลิกการทำงานดังกล่าว ซึ่งทั้งสองฟังก์ชันนี้ถูกออกแบบมาเพื่อใช้งานร่วมกัน