Hàm setInterval trong Javascript là một công cụ mạnh mẽ để lặp lại một đoạn mã theo một khoảng thời gian nhất định. Tuy nhiên, hàm này trả về kết quả gì và chúng ta có thể làm gì với kết quả đó? Trong bài viết này, chúng ta sẽ tìm hiểu tất tần tật về hàm `setInterval` trong Javascript, từ cơ bản đến nâng cao.

Hiểu Về Hàm setInterval

Chức Năng Của Hàm setInterval

Hàm `setInterval` trong Javascript được sử dụng để thực hiện một hàm hoặc đoạn mã nào đó lặp đi lặp lại sau mỗi khoảng thời gian được xác định (tính bằng mili giây). Ví dụ cơ bản:

function sayHello() {
  console.log("Hello, world!");
}

setInterval(sayHello, 1000); // Lặp lại hàm sayHello sau mỗi 1 giây (1000 mili giây)

Giá Trị Trả Về Của setInterval

Hàm `setInterval` trả về một ID duy nhất, gọi là Interval ID. Interval ID này là một số nguyên dương được dùng để định danh cho vòng lặp do `setInterval` tạo ra. Giá trị trả về có thể được sử dụng cùng với hàm `clearInterval` để ngừng vòng lặp. Ví dụ:

let intervalID = setInterval(sayHello, 1000);

// Sau 5 giây, ngừng vòng lặp
setTimeout(() => {
  clearInterval(intervalID);
}, 5000);

Trong ví dụ trên, `intervalID` là giá trị trả về của `setInterval` và được sử dụng như một tham số đầu vào của `clearInterval` để ngừng vòng lặp sau 5 giây.

Các Trường Hợp Sử Dụng setInterval

Sử Dụng Cơ Bản

Để nắm vững cách sử dụng cơ bản, chúng ta có thể xem một ví dụ đơn giản mà một đoạn mã được lặp lại mỗi giây.

function showTime() {
    let date = new Date();
    console.log("Current Time: " + date.toLocaleTimeString());
}

setInterval(showTime, 1000); // Hiển thị thời gian hiện tại mỗi giây

Sử Dụng Với Tham Số

Chúng ta cũng có thể truyền tham số vào hàm được gọi bởi `setInterval`. Ví dụ:

function greet(name) {
    console.log("Hello, " + name);
}

setInterval(greet, 2000, "John"); // Chào "John" sau mỗi 2 giây

Ngừng setInterval

Như đã đề cập ở phần trên, chúng ta có thể sử dụng `clearInterval` để ngừng vòng lặp khi cần thiết. Ví dụ:

let counter = 0;

function count() {
  counter += 1;
  console.log("Counter: " + counter);

  if (counter === 5) {
    clearInterval(intervalID);
  }
}

let intervalID = setInterval(count, 1000); // Đếm từ 1 đến 5, sau đó dừng

Điều Chỉnh setInterval Động

Đôi khi, bạn có thể muốn điều chỉnh khoảng thời gian của `setInterval` theo thời gian. Ví dụ:

let delay = 1000;
let intervalID;

function dynamicInterval() {
  console.log("Dynamic Interval");

  clearInterval(intervalID); // Dừng interval hiện tại
  delay += 1000; // Tăng khoảng thời gian thêm 1 giây
  intervalID = setInterval(dynamicInterval, delay); // Tạo interval mới với khoảng thời gian mới
}

intervalID = setInterval(dynamicInterval, delay); // Bắt đầu với khoảng thời gian ban đầu

Kết Luận

**Hàm `setInterval` trong Javascript là một công cụ cực kỳ hữu ích để lập trình các tác vụ lập đi lập lại theo thời gian cố định. Qua bài viết này, hy vọng bạn đã hiểu rõ hơn về cách sử dụng và tận dụng hàm `setInterval` trong cả những trường hợp cơ bản và phức tạp hơn. Đừng ngần ngại thử áp dụng các ví dụ đã trình bày để làm chủ hàm này nha!**