Trong quá trình làm việc với JavaScript, việc duyệt qua các phần tử của mảng là thao tác cực kỳ phổ biến. Tuy nhiên, nhiều lập trình viên thường nhầm lẫn về cách hoạt động của lệnh return khi chuyển đổi giữa vòng lặp for truyền thống và phương thức forEach(). Bài viết này sẽ làm rõ tại sao return không thể ngắt được forEach() và các giải pháp thay thế hiệu quả.

1. Hiện tượng return "vô tác dụng" trong forEach

Hãy xem xét một ví dụ đơn giản: chúng ta muốn dừng việc in ra các con số khi gặp giá trị 30 trong một mảng.

const dataList = [10, 20, 30, 40, 50];

dataList.forEach(val => {
    if (val === 30) {
        console.log("Tìm thấy 30, thực hiện return...");
        return; 
    }
    console.log("Giá trị:", val);
});

Kết quả thực thi:

Giá trị: 10
Giá trị: 20
Tìm thấy 30, thực hiện return...
Giá trị: 40
Giá trị: 50

Mặc dù chúng ta đã gọi return tại giá trị 30, nhưng các phần tử 40 và 50 vẫn tiếp tục được xử lý. Trong trường hợp này, return chỉ đóng vai trò tương tự như lệnh continue trong vòng lặp thông thường.

2. Cơ chế của vòng lặp for truyền thống

Ngược lại, lệnh return bên trong một vòng lặp for (khi nằm trong một hàm) sẽ ngay lập tức chấm dứt cả vòng lặp lẫn hàm đó.

function findAndStop() {
    const numbers = [1, 2, 3, 4, 5];

    for (let i = 0; i < numbers.length; i++) {
        if (numbers[i] === 3) {
            console.log("Dừng vòng lặp tại 3");
            return; // Thoát toàn bộ hàm
        }
        console.log("Số:", numbers[i]);
    }
    console.log("Dòng này sẽ không bao giờ được in");
}

findAndStop();

Kết quả:

Số: 1
Số: 2
Dừng vòng lặp tại 3

3. Tại sao forEach không thể bị ngắt?

Lý do nằm ở bản chất kiến trúc của JavaScript:

• forEach() là một higher-order function (hàm bậc cao). Nó nhận vào một hàm callback và thực thi hàm callback đó lần lượt trên từng phần tử của mảng.
• Khi bạn viết return bên trong forEach, bạn thực chất chỉ đang kết thúc lần thực thi hiện tại của hàm callback đó chứ không phải kết thúc phương thức forEach.
• Cơ chế bên trong của forEach không quan tâm đến giá trị trả về của hàm callback, nó sẽ luôn gọi callback cho đến phần tử cuối cùng của mảng.

4. Các phương pháp thay thế để ngắt vòng lặp

Nếu bạn cần duyệt mảng và muốn dừng lại giữa chừng khi thỏa mãn điều kiện, hãy sử dụng các phương thức sau:

Sử dụng Array.prototype.some()

Phương thức some() sẽ dừng lại ngay khi hàm callback trả về giá trị true.

const scores = [80, 90, 100, 70, 60];

scores.some(score => {
    if (score === 100) {
        console.log("Đã tìm thấy điểm tối đa, dừng kiểm tra.");
        return true; // Ngắt vòng lặp
    }
    console.log("Đang kiểm tra điểm:", score);
    return false;
});

Sử dụng vòng lặp for...of

Đây là cách hiện đại và dễ đọc nhất, cho phép sử dụng lệnh break để thoát vòng lặp.

const items = ['Apple', 'Banana', 'Orange', 'Mango'];

for (const fruit of items) {
    if (fruit === 'Orange') {
        console.log("Đã thấy Cam, dừng lại.");
        break; 
    }
    console.log("Trái cây:", fruit);
}

5. Tổng kết so sánh

Phương thức	Cơ chế return	Khả năng ngắt
forEach()	Kết thúc lần lặp hiện tại (giống continue)	Không
for / for...of	Thoát khỏi hàm bao bọc	Có (dùng break/return)
some()	Trả về true để ngắt	Có
every()	Trả về false để ngắt	Có