1. Câu lệnh điều kiện trong JavaScript

Trong cuộc sống thì ta biết quá nhiều thứ cần tới điều kiện. Trong học tập cũng vậy, cũng cần có điều kiện. Trong Js hay các ngôn ngữ lập trình khác các câu lệnh điều kiện thường có cấu trúc giống nhau. Ta có thể coi nó là một biểu thức so sánh để giải quyết một vấn đề nào đó mà ta gặp phải. Và ta sẽ có:

  • Nếu điều kiện đúng thì nó sẽ nhận giá trị True và thực hiện thao tác bên trong điều kiện(hiểm nôm na là kết quả)
  • Nếu điều kiện sai thì nó sẽ nhận giá trị False và bỏ qua thao tác bên trong

Trong Js ta có các câu lệnh điều kiện sau:

  • if: Chỉ định một khối code để thực hiện, nếu một điều kiện cho trước là đúng.
  • else: Chỉ định một khối code để thực hiện, nếu một điều kiện ở trên là sai.
  • else if: Chỉ định một điều kiện mới cần kiểm tra, nếu điều kiện ban đầu là sai.
  • switch: Chỉ định những khối code để thực hiện.

Ta sẽ tìm hiểu về switch ở bài sau nhé!

2. Câu lệnh if trong JavaScript

Sử dụng câu lệnh if để chỉ định một khối mã Js sẽ được thực thi nếu một điều kiện là đúng. Nội dung thực hiện của lệnh if sẽ được bao quanh bởi cặp ngoặc nhọn đóng mở {} . Cú pháp chuẩn của lệnh if như sau:

if (condition){
    // code
}

Trong đó condition là mệnh đề điều kiện và luôn luôn phải có một trong hai giá trị là true/false hoặc giá trị tương đương như:

  • NULL => False
  • Rỗng => False
  • Số khác 0 => TRUE
  • Số 0 => FALSE

Chú ý

Lệnh if là viết chữ thường (lowercase). Nếu viết hoa bất kỳ kí tự nào ( If hoặc IF ) sẽ tạo ra lỗi thực thi.

Ví dụ:

<p id="demo">Good Evening!</p>

<script>
if (new Date().getHours() < 18) {
  document.getElementById("demo").innerHTML = "Good day!";
}
</script>

Ví dụ trên sẽ in ra lời chào Good day nếu như bạn chạy code vào lúc chưa đến 18 giờ. Còn nếu hơn thì sẽ là Good Evening vì điều kiện sai và không được thực thi.

3. Câu lệnh 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. Ta có thể coi else là một phần mở rộng của if . Như vậy khi dùng lệnh else thì bắt buộc phải có một lệnh if đứng trước nó.

Cú pháp:

if(điều kiện){
    //đoạn mã này sẽ được thực thi nếu điều kiện là đúng
}else{
    //đoạn mã này sẽ được thực thi nếu điều kiện là sai
}

Ví dụ: tiếp tục với ví dụ trên, nếu giờ nhỏ hơn 18 giờ, hãy tạo lời chào “Good day”, ngược lại là “Good evening”:

<p id="demo"></p>

<script>
const hour = new Date().getHours(); 
let greeting;

if (hour < 18) {
  greeting = "Good day";
} else {
  greeting = "Good evening";
}

document.getElementById("demo").innerHTML = greeting;
</script>

4. Câu lệnh điều kiện else if trong JavaScript

Ta sử dụng câu lệnh else if để chỉ định một điều kiện mới nếu các điều kiện trước đó là sai.

Cú pháp:

if (điều kiện 1) {
    khối lệnh thực thi nếu điều kiện đúng
} else if (điều kiện 2) {
    khối lệnh thực thi nếu điều kiện 1 sai và điều kiện 2 đúng
} else {
     khối lệnh thực thi nếu điều kiện 1 và điều kiện 2 đều sai
}

Nếu khối lệnh if (điều kiện 1) thỏa và chạy thì chương trình sẽ không biên dịch những lệnh if else phía dưới. Hay nói cách khác, Js sẽ thoát khỏi toàn bộ khối lệnh if khi có một lệnh if nào đó được chạy. Tuy nhiên, về mặt tốc độ thì sẽ không tốt, vì Js sẽ biên dịch cho cả hai khối dù cho khối lệnh if ở khối 1 chạy.

Ví dụ: vẫn như ví dụ trên nhưng ta lại muốn. Nếu thời gian nhỏ hơn 10:00, hãy tạo lời chào “Good morning”, nếu không, nhưng thời gian dưới 20:00, hãy tạo lời chào “Good day”, nếu không sẽ là “Good evening”:

<p id="demo"></p>

<script>
const time = new Date().getHours();
let greeting;
if (time < 10) {
  greeting = "Good morning";
} else if (time < 20) {
  greeting = "Good day";
} else {
  greeting = "Good evening";
}
document.getElementById("demo").innerHTML = greeting;
</script>

Đối với lệnh if … else if … else thì không giới hạn số lượng điều kiện.

5. Câu lệnh if else lồng nhau

Ta có thể lồng các câu lệnh if lại với nhau, nghĩa là bên trong câu lệnh if sẽ chứa câu lệnh if khác.

Ví dụ: một ví dụ về xếp loại

    <script type="text/javascript">
var diem = 5;
if(diem<4){
    document.write('Học Lại');
}else{
    if(diem >= 4 && diem < 5.5){
        document.write(' Loại D');
    }else{
        if(diem >= 5.5 && diem < 7 ){
            document.write('Loai C');
        }else{
            if(diem >= 7 && diem < 8.5){
                document.write('Loại B');
            }else {
                if(diem >= 8.5 && diem <= 10){
                    document.write('Loai A');
                }else{
                    document.write('Điểm không hợp lệ');
                }
            }
        }
    }
}
    </script>

6. Câu lệnh if else rút gọn

Chúng ta cũng có thể rút gọn câu lệnh if-else với cú pháp như sau:

(dieukien) ? (đúng) : (sai)

Trong đó: Điều kiện là các biểu thức, mệnh đề trả về giá trị true false.

Ví dụ:

<script type="text/javascript">
    var diem = 5;
        diem==5?document.write('Điểm Bằng 5'):document.write('Diểm khác 5');
</script>