Lệnh điều kiện if ... else trong JavaScript
"Nếu bạn học tốt môn lập trình web thì bạn sẽ có thể thiết kế được website" - Câu trên được chia làm hai vế: Vế thứ nhất: "Nếu bạn học tốt môn lập trình web" Vế thứ hai: "Bạn sẽ có thể thiết kế được website" - Trong cuộc sống, ta gọi vế thứ nhất là điều kiện, vế thứ hai là một điều ...
"Nếu bạn học tốt môn lập trình web thì bạn sẽ có thể thiết kế được website"
- Câu trên được chia làm hai vế:
- Vế thứ nhất: "Nếu bạn học tốt môn lập trình web"
- Vế thứ hai: "Bạn sẽ có thể thiết kế được website"
- Trong cuộc sống, ta gọi vế thứ nhất là điều kiện, vế thứ hai là một điều gì đó sẽ đạt được khi thỏa điều kiện.
- Trong JavaScript cũng có một dạng cú pháp tương tự như vậy, nó kiểm tra một điều kiện và nếu điều kiện đúng thì một đoạn mã xác định sẽ được thực thi. Đó được gọi là "lệnh điều kiện" và trong JavaScript thì lệnh điều kiện được chia làm ba loại cơ bản:
- Lệnh if
- Lệnh if ... else
- Lệnh if ... else if ... else
1) Khái niệm "điều kiện" trong JavaScript
- Trong JavaScript, điều kiện là một biểu thức so sánh hoặc logic để đưa ra một giả thuyết.
- Nếu giả thuyết đúng, đồng nghĩa với việc điều kiện đúng và điều kiện sẽ nhận giá trị là true.
- Nếu giả thuyết sai, đồng nghĩa với việc điều kiện sai và điều kiện sẽ nhận giá trị là false.
- Ví dụ:
| Điều kiện | Mô tả | Giá trị |
|---|---|---|
| 7 > 4 | Bảy lớn hơn bốn | true |
| 7 >= 4 | Bảy lớn hơn hoặc bằng bốn | true |
| 7 < 4 | Bảy nhỏ hơn bốn | false |
| "webcoban"=="laptrinhweb" | Chuỗi "webcoban" giống với chuỗi "laptrinhweb" | false |
| "webcoban"!="laptrinhweb" | Chuỗi "webcoban" khác với chuỗi "laptrinhweb" | true |
| (5+7) > 10 | Tổng của năm và bảy lớn hơn mười | true |
| (5+7) < 10 | Tổng của năm và bảy nhỏ hơn mười | false |
2) Lệnh điều kiện if trong JavaScript
- Lệnh if dùng để kiểm tra một điều kiện, nếu điều kiện đó là đúng thì một đoạn mã xác định sẽ được thực thi.
- Cú pháp:
Nếu điều kiện "giá trị của biến number lớn hơn 50" là đúng thì hiển thị ba câu:
- Tài liệu học HTML
- Tài liệu học CSS
- Tài liệu học JavaScript
<script>
var number = 75;
if(number > 50){
document.write("<p>Tài liệu học HTML</p>");
document.write("<p>Tài liệu học CSS</p>");
document.write("<p>Tài liệu học JavaScript</p>");
}
</script>
3) Lệnh điều kiện if ... else trong JavaScript
- Lệnh if ... else dùng để kiểm tra một điều kiện, nếu điều kiện đó là đúng thì một đoạn mã xác định sẽ được thực thi, còn nếu điều kiện đó sai thì một đoạn mã xác định khác sẽ được thực thi.
- Cú pháp:
Nếu điều kiện "giá trị của biến numberOne lớn hơn giá trị của biến numberTwo" là đúng thì hiển thị ba câu:
- Tài liệu học HTML
- Tài liệu học CSS
- Tài liệu học JavaScript
Còn nếu điều kiện "giá trị của biến numberOne lớn hơn giá trị của biến numberTwo" là sai thì hiển thị hai câu:
- Tài liệu học MySQL
- Tài liệu học PHP
<script>
var numberOne = 15;
var numberTwo = 20;
if(numberOne > numberTwo){
document.write("<p>Tài liệu học HTML</p>");
document.write("<p>Tài liệu học CSS</p>");
document.write("<p>Tài liệu học JavaScript</p>");
}else{
document.write("<p>Tài liệu học MySQL</p>");
document.write("<p>Tài liệu học PHP</p>");
}
</script>
4) Lệnh điều kiện if ... else if ... else trong JavaScript
- Lệnh if ... else if ... else là một dạng nâng cao của lệnh if ... else
- Lệnh if ... else if ... else dùng để mở rộng phạm vi kiểm tra các điều kiện khác nếu tất cả những điều kiện phía trên là sai.
- Cú pháp:
<script>
var a = 15;
var b = 20;
if(a > b){
document.write("Giá trị biến a LỚN HƠN giá trị biến b");
}else if(a < b){
document.write("Giá trị biến a NHỎ HƠN giá trị biến b");
}else{
document.write("Giá trị biến a BẰNG giá trị biến b");
}
</script>
- Lưu ý: Đối với lệnh if ... else if ... else thì không giới hạn số lượng điều kiện.
<script>
var day = new Date().getDay();
if(day == 0){
document.write("Hôm nay là Chủ Nhật");
}else if(day == 1){
document.write("Hôm nay là Thứ Hai");
}else if(day == 2){
document.write("Hôm nay là Thứ Ba");
}else if(day == 3){
document.write("Hôm nay là Thứ Tư");
}else if(day == 4){
document.write("Hôm nay là Thứ Năm");
}else if(day == 5){
document.write("Hôm nay là Thứ Sáu");
}else{
document.write("Hôm nay là Thứ Bảy");
}
</script>
