17 Oct

Rate this post

Hôm nay hocthietkeweb.net tiếp tục giới thiệu đến các bạn những kiến thức căn bản của Javascript ,giúp các bạn có được một kiến thức vững chắc,Javascript hỗ trợ cấu trúc lệnh điều kiện if…else nhằm mục đích thực hiện các hành động khác nhau dựa trên các điều kiện khác nhau.

 


Câu lệnh if
Đây là câu lệnh cơ bản nhất trong cấu trúc lệnh điều kiện. Nó cho phép Javascript kiểm tra điều kiện được đưa ra, nếu kết quả trả trả về là đúng(true), các câu lệnh sẽ được thực thi, ngược lại chúng sẽ bị bỏ qua.

Cú pháp

1
2
3
4
if (điều kiện)
{
  Javscript code here
}

 

Cấu trúc lệnh if else
Cấu trúc lệnh if…else có chức năng tương tự như câu lệnh if song có thêm từ khóa else để xử lý các hành động sẽ được thực thi nếu điều kiện không trả về đúng.

Cú pháp

1
2
3
4
5
6
7
8
if (điều kiện)
{
  Javscript code here
}
else
{
  Javscript code here
}

Cấu trúc lệnh if…else
Cấu trúc này tương tự như cấu trúc if…else tuy nhiên nó cho phép kiểm tra chính xác điều kiện để thực hiện các lệnh. Với cấu trúc này, người lập trình có thể tạo ra từ 2 cho đến nhiều nhánh kiểm tra điều kiện khác nhau.
Cú pháp

1
2
3
4
5
6
7
8
9
10
11
12
if (điều kiện)
{
  Javscript code here
}
else if (điều kiện 2)
{
  Javscript code here
}
else
{
  Javscript code here
}

B1: Tạo file bai4.html, nhập đoạn code sau

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Bài 4 - Cấu trúc if...else trong Javascript</title>
</head>
<body>
<script type="text/javascript" language="javascript">
var myVar = "Chào bạn";
if(myVar == "Tạm biệt")
{
    document.write("Chà đã đến giờ về rồi sao?");
}
else if(myVar == "Chào buổi sáng")
{
    document.write("Ồ một ngày đẹp trời!");
}
else if(myVar == "Chào bạn")
{
    document.write(myVar);
}
</script>
</body>
</html>

B2: Mở file với trình duyệt

vietobject-javascript-ifelse

 

Tiếp theo của câu lệnh if …else đó là câu lệnh điều kiện switch case trong Javascript.Cấu trúc switch case có chức năng gần tương tự so với cấu trúc if…else, ngoại trừ việc nó được sử dụng trong các tình huống kiểm tra cùng một biến đơn giản với các giá trị (trường hợp) khác nhau.

Cú pháp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
switch (biểu thức)
{
  case giá trị 1:
      code;
      break;
   case giá trị 2:
      code;
      break;
   ....
  case giá trị n:
      code;
      break;
  default:
      code;
}

Lưu ý:

  • Mỗi mệnh đề case đều phải có lệnh break ở cuối để có thể thoát ra khỏi khối switch khi biểu thực đạt đúng giá trị đưa ra. Nếu không, tất cả các lệnh trong các case sẽ đều được thực thi.
  • Câu lệnh trong mệnh đề default được thực hiện nếu không có giá trị ứng với mệnh đề case nào được so sánh khớp.

B1: Tạo file bai5.html, nhập đoạn code sau

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Bài 5 - Cấu trúc switch case trong Javascript</title>
</head>
<body>
<script type="text/javascript" language="javascript">
var date,workToDO;
date = "thứ hai";
switch(date)
{
    case "thứ hai":
    workToDO = "Học thêm Văn";
    break;
    
    case "thứ ba":
    workToDO = "Học thêm Toán";
    break;
    
    case "thứ tư":
    workToDO = "Học thêm Anh";
    break;
    
    case "thứ năm":
    workToDO = "Học thêm Lý";
    break;
    
    case "thứ sáu":
    workToDO = "Học thêm Hóa";
    break;
    default:
    workToDO = "Ngày nghỉ.";
}
document.write("Hôm nay là "+date+", "+workToDO);
</script>
</body>
</html>

B2: Mở file với trình duyệt

vietobject-javascript-switch-case

Nguồn:vietobject.com