Làm cách nào để dừng setInterval() gọi một hàm trong JavaScript?

Phương thức setInterval[] trong JavaScript đánh giá một biểu thức theo các khoảng thời gian. Nó được sử dụng để thực hiện các nhiệm vụ hoặc hoạt động lặp đi lặp lại cần được thực hiện trong một khoảng thời gian cụ thể. Ví dụ, nó gọi một chức năng lặp đi lặp lại trong một khoảng thời gian trễ cố định để thực hiện tác vụ. Giao diện cửa sổ cung cấp phương pháp này

Phương thức này trả về một id khoảng thời gian xác định duy nhất khoảng thời gian đó, cho phép bạn xóa nó sau bằng cách thực thi phương thức clearInterval[]

Người dùng có thể làm theo cú pháp dưới đây để sử dụng hàm setInterval

cú pháp

setInterval[function, time, parameter1, parameter2, ...]

Trong cú pháp trên, chúng tôi hiển thị tất cả các tham số mà hàm setInterval cần để thực hiện các hoạt động của nó

Thông số

• chức năng - Hàm hoặc mã sẽ thực thi trong một khoảng thời gian cụ thể [Bắt buộc]

• time − Khoảng thời gian tính bằng mili giây [Bắt buộc]

• tham số1, tham số2,. − Các tham số truyền vào hàm [Tùy chọn]

loại trả lại

• số - Id của bộ đếm thời gian setInterval. Nó được sử dụng để dừng bộ định thời setInterval bằng cách chuyển nó vào hàm clearInterval[]

ví dụ 1

Đồng hồ kỹ thuật số sử dụng chức năng setInterval

Trong ví dụ dưới đây, chúng tôi đã sử dụng hàm setInterval trong JavaScript để tạo đồng hồ kỹ thuật số. Chúng tôi đã sử dụng hàm tạo Ngày của JavaScript để lấy thời gian hiện tại và sau đó thay đổi văn bản bên trong của một phần tử trong mỗi khoảng thời gian 1 giây. Tài liệu. Phương thức getElementById[] được sử dụng để truy cập một đối tượng phần tử nhằm thay đổi InternalHTML của phần tử để hiển thị thời gian hiện tại trong đó

ví dụ 2

Bắt đầu và dừng bộ đếm bằng hàm setInterval

Trong ví dụ bên dưới, chúng tôi đã sử dụng hàm setInterval trong JavaScript để tăng giá trị bộ đếm và dừng giá trị bộ đếm bằng cách sử dụng hai lần bấm nút. Có hai nút, 'Bắt ​​đầu' và 'Dừng'; . Chúng ta đã sử dụng hàm clearInterval[] để dừng hàm setInterval

Trong hướng dẫn này, chúng ta đã học cách sử dụng lệnh gọi hàm setInterval trong JavaScript. Chúng ta đã thảo luận về cú pháp, tham số và kiểu trả về của hàm này. Chúng tôi đã sử dụng hàm setInterval trong hai ví dụ để tạo đồng hồ kỹ thuật số và bộ đếm gia tăng có thể điều khiển được. Ngoài ra, chúng ta đã học hàm clearInterval để dừng bộ hẹn giờ setInterval. Người dùng có thể theo dõi các ví dụ để hiểu thêm chức năng của hàm setInterval

Phương thức setInterval[] trong JavaScript được sử dụng để lặp lại một chức năng đã chỉ định tại mỗi khoảng thời gian nhất định. Nó đánh giá một biểu thức hoặc gọi một hàm trong các khoảng thời gian nhất định. Phương thức này tiếp tục gọi hàm cho đến khi đóng cửa sổ hoặc phương thức clearInterval[] được gọi. Phương thức này trả về một giá trị số hoặc một số khác 0 xác định bộ đếm thời gian đã tạo

Không giống như phương thức setTimeout[], phương thức setInterval[] gọi hàm nhiều lần. Phương thức này có thể được viết có hoặc không có tiền tố cửa sổ

Cú pháp thường được sử dụng của phương thức setInterval[] được đưa ra dưới đây

cú pháp

Giá trị tham số

Phương thức này nhận hai giá trị tham số là hàm và mili giây được định nghĩa như sau

chức năng. Nó là hàm chứa khối mã sẽ được thực thi

mili giây. Tham số này biểu thị độ dài của khoảng thời gian giữa mỗi lần thực hiện. Khoảng thời gian tính bằng mili giây. Nó xác định tần suất mã sẽ được thực thi. Nếu giá trị của nó nhỏ hơn 10, giá trị 10 được sử dụng

Làm thế nào để dừng việc thực hiện?

Chúng ta có thể sử dụng phương thức clearInterval[] để dừng thực thi hàm được chỉ định trong phương thức setInterval[]. Giá trị được trả về bởi phương thức setInterval[] có thể được sử dụng làm đối số của phương thức clearInterval[] để hủy bỏ thời gian chờ

Hãy hiểu việc sử dụng phương thức setInterval[] bằng cách sử dụng một số hình ảnh minh họa

Ví dụ 1

Đây là một ví dụ đơn giản về việc sử dụng phương thức setInterval[]. Tại đây, một hộp thoại cảnh báo hiển thị trong khoảng thời gian 3 giây. Chúng tôi không sử dụng bất kỳ phương thức nào để dừng thực thi hàm được chỉ định trong phương thức setInterval[]. Vì vậy, phương thức tiếp tục thực hiện chức năng cho đến khi đóng cửa sổ

đầu ra

Sau khoảng thời gian ba giây, đầu ra sẽ là -

Bây giờ, có một ví dụ khác về việc sử dụng phương thức setInterval[]

Ví dụ2

Tại đây, màu nền sẽ thay đổi sau mỗi 200 mili giây. Chúng tôi không sử dụng bất kỳ phương thức nào để dừng thực thi hàm được chỉ định trong phương thức setInterval[]. Vì vậy, phương thức tiếp tục thực hiện chức năng cho đến khi đóng cửa sổ

đầu ra

Nền sẽ tiếp tục thay đổi từ xanh nhạt sang xanh nhạt trong khoảng thời gian 200 mili giây. Sau 200 mili giây, đầu ra sẽ là -

Ví dụ3

Trong ví dụ trên, chúng tôi đã không sử dụng bất kỳ phương pháp nào để dừng chuyển đổi giữa các màu. Ở đây, chúng tôi đang sử dụng phương thức clearInterval[] để dừng chuyển đổi màu sắc trong ví dụ trước

Chúng ta phải nhấp vào nút dừng được chỉ định để xem hiệu ứng

đầu ra

Màu nền sẽ bắt đầu thay đổi sau 200 mili giây. Khi nhấp vào nút dừng được chỉ định, việc chuyển đổi giữa các màu sẽ bị dừng trên màu nền tương ứng. Đầu ra sau khi nhấp vào nút sẽ là -

Làm cách nào để dừng hàm setInterval trong JavaScript?

Hàm nào sẽ dừng tiếp tục hàm setInterval?

Chức năng gọi setInterval có ngay lập tức không?

Lệnh gọi hàm nào dừng setInterval trong đoạn mã sau?