Hướng dẫn dùng 100+1 JavaScript

Vòng lặp for trong Javascript In ra các số từ 1 - 100

DEMO

Nội dung chính

• Vòng lặp for trong Javascript In ra các số từ 1 - 100
• Cùng chuyên mục:
• Sử dụng vòng lặp while
• Sử dụng vòng lặp do while
• Cùng chuyên mục:
• 1] Vòng lặp là gì?
• 2] Cách sử dụng vòng lặp for trong JavaScript
• 2.1] Cú pháp
• 2.2] Ví dụ thứ nhất
• 2.3] Ví dụ thứ hai
• 2.4] Ví dụ thứ ba
• 2.5] Một số điều cần lưu ý
• 2.6] Vòng lặp for lồng nhau
• 2.7] Lệnh break
• 2.8] Lệnh continue
• 2.9] Lặp qua một lần các phần tử của mảng
• 3] Cách sử dụng vòng lặp for in trong JavaScript

Hãy sử dụng vòng lặp for trong Javascript để in ra các số từ 1 đến 100, sử dụng lệnh document.write để in và thêm dấu gạch hàng - để tách biệt các số cho dễ nhìn.

Bài giải

-------------------- ######## --------------------

Bài này quá đơn giản vì trong video lý thuyết mình đã giải rồi, tuy nhiên mình sẽ giải thêm một lần nữa cho các bạn không xem video cũng có thể học được.

Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

Chúng ta sẽ sử dụng vòng lặp for với điểm bắt đầu là 1 và điều kiện lặp là phải bé hơn hoặc bằng 100, bước nhảy là 1.

for [var i = 1; i  1 có đúng hay không.
[Kết quả đúng nên đoạn mã nằm trong cặp dấu {} được thực thi]
Giá trị của biến i
bị giảm đi một [tức bây giờ giá trị của biến i sẽ là 8]
Lần thứ hai
Kiểm tra xem điều kiện i > 1 có đúng hay không.
[Kết quả đúng nên đoạn mã nằm trong cặp dấu {} được thực thi]

  

Giá trị của biến i bị giảm đi một [tức bây giờ giá trị của biến i sẽ là 7]
....
....
....
....
....
Lần thứ tám
Kiểm tra xem điều kiện i > 1 có đúng hay không.
[Kết quả đúng nên
đoạn mã nằm trong cặp dấu {} được thực thi]
Giá trị của biến i bị giảm đi một [tức bây giờ giá trị của biến i sẽ là 1]
Lần thứ chín
Kiểm tra xem điều kiện i > 1 có đúng hay không.
[Kết quả là SAI vì 1 không lớn hơn 1]
==> VÒNG LẶP KẾT THÚC
2.5] Một số điều cần lưu ý
LƯU Ý THỨ NHẤT
- Trong biểu thức 1 của ví dụ thứ nhất, biến i được khai báo với
giá trị là 1 nhưng còn ở ví dụ thứ hai thì biến i được khai báo với giá trị là 0.
- Trong biểu thức 2 của ví dụ thứ nhất, biểu thức điều kiện ta dùng phép so sánh  Cái mà bạn cần quan tâm chính là thiết kế ra một mô hình giúp cho vòng lặp có thể hoạt động đúng theo số lần mong muốn.
- Ví dụ, năm đoạn mã bên dưới có cách viết khác nhau, tuy nhiên chúng có cùng một chức năng là hiển thị bảy câu "Lập Trình Web" lên màn hình
for[var i = 0; i < 7; i++]{
    document.write["
Lập Trình Web
"];
}
for[var i = 1; i  2; i--]{
    document.write["
Lập Trình Web
"];
}
for[var i = 0; i < 13; i = i + 2]{
    document.write["
Lập Trình Web
"];
}
LƯU Ý THỨ HAI
- Biểu thức 1 thường là câu lệnh khai báo biến để tham gia vào biểu thức điều kiện.
- Tuy
nhiên, nếu biến dùng để tham gia vào biểu thức điều kiện đã được khai báo và gán giá trị trước đó rồi thì biểu thức 1 ta có thể bỏ trống.

  

- Ví dụ:
var i = 0;
for[; i < 7; i++]{
    document.write["
Lập Trình Web
"];
}
- Còn nếu biến dùng để tham gia vào biểu thức điều kiện đã được khai báo trước đó nhưng chưa được gán giá trị thì trong biểu thức 1 ta chỉ cần gán giá trị cho biến [không cần dùng đến từ khóa var]
- Ví dụ:
var i;
for[i = 0; i < 7; i++]{
    document.write["
Lập Trình Web
"];
}
LƯU Ý THỨ BA
- Biểu thức 3 trong vòng lặp for rất quan
trọng, nó khiến điều kiện của vòng lặp dần dần trở thành bị SAI để giúp cho vòng lặp được kết thúc [Nếu một vòng lặp mà điều kiện luôn luôn đúng thì vòng lặp đó sẽ không bao giờ kết thúc và dẫn đến trường hợp chương trình bị lỗi]
- Tuy nhiên, nếu trong đoạn mã được thực thi có chứa câu lệnh làm thay đổi giá trị của biến điều kiện thì biểu thức 3 ta có thể bỏ trống.
- Ví dụ:
for[var i = 0; i < 7;]{
    document.write["
Lập Trình Web
"];
    i++;
}
LƯU Ý THỨ TƯ
- Trong phần LƯU Ý THỨ HAI & LƯU Ý THỨ BA tôi đã giới
thiệu về trường hợp mà biểu thức 1 và biểu thức 3 có thể bỏ trống, tuy nhiên đó là một số trường hợp đặc biệt. Về mặt viết mã lệnh tốt thì bạn không nên bỏ trống biểu thức như thế, bạn cần phải xây dựng đoạn mã như thế nào để cho cả ba biểu thức đều phải có mặt đầy đủ.
2.6] Vòng lặp for lồng nhau
- Thực chất vòng lặp for lồng nhau chỉ là cách sử dụng nâng cao của vòng lặp for thông thường để giúp
cho số lần lặp được tăng theo cấp số nhân.

  

- Vòng lặp con được đặt vào bên trong vòng lặp cha. Khi điều kiện của vòng lặp cha đúng thì vòng lặp con sẽ được thực thi.
- Dưới đây là cú pháp cơ bản của một vòng lặp for lồng nhau:
for[biểu thức 1; biểu thức 2; biểu thức 3]{
    for[biểu thức 1; biểu thức 2; biểu thức 3]{
        //Đoạn mã mà bạn muốn được thực thi nhiều lần
    }
}
- Lưu ý: Bên trong vòng lặp cha, ngoài vòng lặp con thì nó còn có thể chứa thêm các mã lệnh khác.
- Hiển thị dãy số từ 1 đến 50 [bằng cách sử dụng vòng lặp for lồng nhau]


    var number = 1;

    for[i = 0; i < 10; i++]{
        for[j = 0; j < 5; j++]{
            document.write[number + " "];
            number++;
        }
    }

Xem ví dụ
- Hiển thị ba dòng dãy số 1 2 3
4 5 6 7 8 9

    for[i = 1; i < 4; i++]{
        var text = "";
        for[j = 1; j < 10; j++]{
            text = text + j + " ";
        }
        document.write[text + "
"];
    }
Xem ví dụ
- Hiển thị một ma trận ô vuông giống hình bên dưới:

    .square{
        height:20px;
        width:20px;
        float:left;
        border:1px solid gray;
        margin-left:5px;
        margin-bottom:5px;
    }



    for[var i = 0; i < 5; i++]{
        for[var j = 0; j < 10; j++]{
            document.write["
"];
        }
        document.write["
"];
    }
Xem ví dụ
2.7] Lệnh break
- Lệnh break thường được đặt vào bên trong vòng lặp for.
- Khi lệnh break được thực thi, vòng lặp sẽ kết thúc mặc cho điều kiện của vòng lặp có còn đúng hay không.
- Lặp lại 10 lần việc hiển thị giá trị của biến number.
- Sau mỗi lần hiển thị cho giá trị của biến number tăng thêm một.
- Tuy
nhiên, đến khi giá trị của biến number được tăng lên thành 5 thì kết thúc vòng lặp.

    var number = 1;
    for[var i = 1; i