Kiến thức cơ bản về làm việc với hàm setInterval trong JavaScript

Trong bài học này, chúng ta sẽ học cách làm việc với bộ đếm thời gian trong JavaScript. Sau khi hiểu về bộ đếm thời gian, bạn sẽ có thể tự động thực hiện các thao tác trên trang sau một khoảng thời gian xác định. Chẳng hạn, bạn có thể tạo một trình chiếu hình ảnh, trong đó các hình ảnh sẽ thay đổi mỗi giây.

Để làm việc với bộ đếm thời gian trong JavaScript, người ta sử dụng hàm setInterval, hàm này sẽ chạy mã đã cho sau những khoảng thời gian nhất định.

Hàm này hoạt động như sau: tham số đầu tiên nó nhận là mã nguồn của hàm, còn tham số thứ hai - là khoảng thời gian, sau đó hàm này sẽ được tự động gọi. Tham số thứ hai được đặt bằng mili giây (1000 mili giây = 1 giây).

Hãy cùng tìm hiểu cách hoạt động của hàm qua một ví dụ nào đó. Ví dụ, viết mã để mỗi giây in một cái gì đó ra console.

Đầu tiên, hãy tạo một hàm in một cái gì đó ra console:

function timer() {
	console.log('!');
}

Và bây giờ sử dụng setInterval để buộc hàm chúng ta đã tạo thực thi mỗi giây:

setInterval(timer, 1000);

function timer() {
	console.log('!');
}

Không nhất thiết phải tạo một hàm riêng biệt - bạn có thể chỉ cần truyền vào tham số đầu tiên của setInterval một hàm ẩn danh, như thế này:

setInterval(function() {
	console.log('!');
}, 1000);

Hãy khởi động bộ đếm thời gian, cứ mỗi 3 giây sẽ in một cái gì đó ra console.