Trong bài hướng dẫn tự học Lập trình JavaScript này bạn sẽ được học về các bộ hẹn giờ (Timer functions)
Bộ hẹn giờ trong JavaScript
Mục lục nội dung
1. Bộ hẹn giờ là gì?
Bộ hẹn giờ ( Timer ) là một công dụng được cho phép tất cả chúng ta triển khai một tính năng tại một thời gian đơn cử .
Sử dụng bộ hẹn giờ, bạn hoàn toàn có thể trì hoãn việc thực thi code để nó không hoàn thành xong vào đúng thời gian một sự kiện được kích hoạt hoặc khi trang được tải .
Ví dụ : Bạn hoàn toàn có thể sử dụng bộ hẹn giờ để đổi khác những biểu ngữ quảng cáo trên website của mình theo khoảng chừng thời hạn đều đặn hoặc hiển thị đồng hồ đeo tay thời hạn thực, v.v.
Có hai hàm hẹn giờ trong JavaScript: setTimeout() và setInterval().
Phần tiếp sau đây sẽ hướng dẫn bạn cách tạo bộ hẹn giờ để trì hoãn việc thực thi codecũng như cách triển khai lặp lại một hoặc nhiều hành vi bằng cách sử dụng những hàm này trong JavaScript .
2. Thực thi code sau khi trì hoãn một thời gian với setTimout trong JavaScript
Hàm setTimeout() trong JavaScript được sử dụng để thực thi một hàm hoặc đoạn mã được chỉ định chỉ một lần sau một khoảng thời gian nhất định.
Cú pháp cơ bản của setTimeout là :
setTimeout(function, milliseconds)
Hàm này gật đầu hai tham số :
+ Một hàm : Là hàm để thực thi
+ Một tham số tùy chọn để chỉ định độ trễ, là số mili giây biểu lộ lượng thời hạn chờ trước khi thực thi hàm ( 1 giây = 1000 mili giây ) .
Hãy xem cách nó hoạt động giải trí như thế nào qua ví dụ sau :
Ví dụ trên sẽ hiển thị thông tin cảnh báo nhắc nhở sau 3 giây khi click vào nút .
Lưu ý : Nếu tham số trễ bị bỏ lỡ hoặc không được chỉ định, giá trị 0 ( mặc định ) sẽ được sử dụng, điều đó có nghĩa là hàm đã chỉ định được thực thi ‘ ngay lập tức ‘ hoặc càng sớm càng tốt .
3. Thực thi code sau khoảng thời gian đều đặn với setInterval trong JavaScript
Tương tự, bạn có thể sử dụng hàm setInterval() để thực thi một hàm hoặc đoạn mã được chỉ định lặp đi lặp lại vào những khoảng thời gian cố định.
Cú pháp cơ bản của setInterval là :
Xem thêm: Downtown Là Gì? Uptown Là Gì? Phân Biệt Downtown Và Uptown Nguồn Gốc Và Ý Nghĩa Của Từ Downtown
setInterval(function, milliseconds)
Hàm này cũng đồng ý hai tham số :
+ Một hàm, là hàm để thực thi
+ Khoảng thời hạn, là số mili giây biểu lộ lượng thời hạn chờ trước khi thực thi hàm ( 1 giây = 1000 mili giây ) .
Đây là một ví dụ :
Thời gian hiện tại (tính theo máy tính của bạn là):
Ví dụ trên sẽ thực thi hàm showTime ( ) lặp lại sau 1 giây .
Chức năng này sẽ lấy thời hạn hiện tại trên máy tính của bạn và hiển thị trên trình duyệt .
4. Phương pháp dừng thực thi code hoặc hủy hẹn giờ
Cả hai phương thức setTimeout() và setInterval() đều trả về một ID duy nhất (một giá trị nguyên dương, được gọi là timer identifier) xác định bộ hẹn giờ được tạo bởi các phương thức này.
Sau khi có ID này, bạn hoàn toàn có thể được sử dụng để tắt hoặc xóa bộ đếm thời hạn và dừng việc thực thi mã trước đó .
Xóa bộ đếm thời gian có thể được thực hiện bằng cách sử dụng hai hàm: clearTimeout() và clearInterval().
Hãy xem ví dụ xóa việc thực thi hàm setTimout ( ) :
Tương tự, phương pháp clearInterval ( ) được sử dụng để xóa hoặc vô hiệu bộ hẹn giờ setInterval ( ) .
Thời gian hiện tại (tính theo máy tính của bạn là):
Lưu ý : Về mặt kỹ thuật, bạn hoàn toàn có thể sử dụng thay thế sửa chữa clearTimeout ( ) cho clearInterval ( ). Tuy nhiên, để bảo vệ tính rõ ràng và năng lực bảo dưỡng, bạn nên tránh làm như vậy .
Như vậy là qua bài viết này, bạn đã biết cách sử dụng bộ hẹn giờ trong JavaScript thông qua hai phương thức setTimeout() và setInterval().
Cũng đơn thuần thôi phải không ?
Nhưng chỉ với 2 phương pháp này, bạn hoàn toàn có thể tạo ra nhiều chương trình mê hoặc cho ứng dụng của mình đấy .
Note: Nếu bạn đang quan tâm đến lập trình web thì tham khảo ngay KHÓA HỌC LẬP TRÌNH WEB (Full Stack). Học trong 12 tháng – Học chắc tay – Hành nghề ngay!
Source: https://mindovermetal.org
Category: Wiki là gì
