Chương 2 – Biến, kiểu dữ liệu và toán tử(Tiếp)

Thực hiện các phép tính toán

4. Cấu trúc điều kiện if-else

Câu lệnh if

Câu lệnh if được sử dụng để xem xét việc thực thi một thao tác nào đó dựa trên điều kiện hiện tại.

Cú pháp:

1.	if (biểu_thức_điều_kiện) {
2.	    khối mã được thực thi nếu điều kiện là đúng
3.	}

Câu lệnh if bao gồm một biểu thức điều kiện và một khối lệnh ở trong phần thân của nó. Tại thời điểm thực thi, nếu biểu thức điều kiện trả về kết quả true thì khối lệnh trong phần thân sẽ được thực thi, còn nếu biểu thức điều kiện trả về false thì khối lệnh trong phần thân sẽ được bỏ qua.

Ví dụ: 

1.	if(score > 9) {
2.	   classification = "Xuất sắc";
3.	}

Trong đoạn mã này biểu thức điều kiện là score > 9, còn phần thân là classification =  “Xuất sắc”. Khi thực thi chương trình nếu biến score có giá trị lớn hơn 9 thì biến classification sẽ được gán giá trị là “Xuất sắc”, còn nếu biến score có giá trị bằng hoặc nhỏ hơn 9 thì biến classification sẽ không được gán giá trị mới.

Lưu ý: Nếu phần thân chỉ có một câu lệnh duy nhất thì chúng ta có thể không cần viết dấu mở và đóng ngoặc, còn nếu trong trường hợp phần thân có nhiều hơn 1 câu lệnh thì chúng ta bắt buộc phải mở và đóng ngoặc.

Câu lệnh if-else

Câu lệnh if-else là dạng đầy đủ của câu lệnh if.

Cú pháp:

1.	if (biểu_thức_điều_kiện) {
2.	   khối mã được thực thi nếu điều kiện là đúng
3.	} else {
4.	   khối mã được thực thi nếu điều kiện trên là sai
5.	}

Câu lệnh if-else cũng bao gồm một biểu thức điều kiện, nhưng lại có hai phần thân khác nhau. Một phần thân gắn với phần if và một phần thân gắn với phần else.

Nếu biểu thức điều kiện trả về true thì phần thân gắn với if được thực thi, còn nếu biểu thức điều kiện trả về false thì phần thân gắn với phần else được thực thi.

Luồng thực thi của câu lệnh if-else có thể được mô tả như lưu đồ dưới đây:

Hình: Luồng thực thi của câu lệnh if-else

Ví dụ 1:

1.	if(hour < 18){
2.	   greeting = "Good day";
3.	}else{
4.	   greeting = "Good evening";
5.	}

Trong đoạn mã trên, biểu thức điều kiện là hour < 18, còn phần thân của if là greeting = “Good day” và phần thân của else là greeting = “Good evening”.

Khi thực thi, nếu biến hour có giá trị nhỏ hơn 18 thì biến greeting sẽ được gán giá trị là “Good day”, còn nếu biến hour có giá trị lớn hơn hoặc bằng 18 thì biến greeting sẽ được gán giá trị là “Good evening”.

Ví dụ 2:

1.	if(number % 2 == 0){
2.	   alert(number + " is even.");
3.	}else{
4.	   alert(number + " is odd.")
5.	}

Trong ví dụ trên, chúng ta đánh giá một số nguyên và phân loại số đó là số chẵn hay là số lẻ.

Trong trường hợp này, biểu thức điều kiện là để đánh giá xem số hiện tại có chia hết cho 2 hay không, còn hai phần thân là hiển thị thông báo tương ứng.

Việc đánh giá chia hết cho 2 hay không được thực hiện thông qua phép chia lấy phần dư và sau đó so sánh với giá trị 0. Nếu phần dư bằng không thì chứng tỏ đây là số chẵn, còn nếu phần dư khác 0 thì số đó là số lẻ.

Chẳng hạn, nếu number có giá trị là 4 thì kết quả phép chia cho 2 lấy phần dư là 0, do vậy biểu thức điều kiện sẽ trả về đúng, và phần thân của if được thực thi.

Nếu number có giá trị là 5 thì kết quả phép chia cho 2 lấy phần dư là 1, do vậy biểu thức điều kiện trả về sai, phần thân của else được thực thi.

if-else với một dòng lệnh bên trong

Trong trường hợp chỉ có một dòng lệnh bên trong if hoặc else thì có thể bỏ dấu ngoặc.

Ví dụ:

1.	if(number % 2 == 0)
2.	  alert(number + " is even.");
3.	else
4.	  alert(number + " is odd.")

5. Cấu trúc điều kiện if-else lồng nhau

Ngoài việc sử dụng câu lệnh if-else riêng lẻ, chúng ta cũng có thể đặt câu lệnh if-else này trong câu lệnh if-else khác. Điều này xảy ra khi chúng ta muốn đánh giá nhiều biểu thức điều kiện trước khi thực thi một thao tác nào đó.

Cú pháp:

1.	if (điều kiện 1) {
2.	     //khối lệnh thực thi nếu điều kiện 1 đúng
3.	     if (điều kiện 2) {
4.	          //khối lệnh thực thi nếu điều kiện 2 đúng
5.	     } else {
6.	          //khối lệnh thực thi nếu điều kiện 2 sai
7.	     }
8.	} else {
9.	     //khối lệnh thực thi nếu điều kiện 1 sai
10.	}

Ví dụ:

1.	if (a > b) {
2.	   if (a > c) {
3.	       console.log("Số lớn nhất là a = " + a);
4.	   } else {
5.	       console.log("Số lớn nhất là c = " + c);
6.	   }
7.	} else {
8.	   if (b > c) {
9.	       console.log("Số lớn nhất là b = " + b);
10.	  } else {
11.	      console.log("Số lớn nhất là c = " + c);
12.	   }
13.	}

Trong ví dụ này, chúng ta so sánh các giá trị của 3 biến là a, b và c để tìm ra giá trị lớn nhất trong 3 số đó. Chúng ta cần đặt các câu lệnh điều kiện bên trong các câu lệnh điều kiện khác.

Chẳng hạn, với trường hợp a = 5, b = 4, c = 3 thì biểu thức a > b sẽ trả về kết quả true, do đó phần thân của lệnh if này được thực thi, phần thân của lệnh else tương ứng sẽ được bỏ qua. Sau đó, biểu thức a > c cũng trả về kết quả true, do đó phần thân của câu lệnh if này cũng sẽ được thực thi, và phần thân của câu lệnh else tương ứng sẽ được bỏ qua. Như vậy, chuỗi in ra sẽ là “Số lớn nhất là a = 5”.

Hỏi nhanh: Hãy thử suy luận để xem luồng thực thi của đoạn mã trên sẽ là như thế nào trong trường hợp a = 3, b = 4, c = 5.

6. Cấu trúc điều kiện if-else bậc thang

Khi chúng ta kết hợp nhiều câu lệnh if-else liên tiếp nhau theo dạng if-else-if thì chúng ta được một dạng mới thường được gọi là câu lệnh điều kiện if-else bậc thang. Gọi là bậc thang bởi vì khi viết chúng được trình bày dạng như các bậc thang hướng từ trên xuống dưới.

Các khối lệnh điều kiện được đặt trong các câu lệnh if nối tiếp nhau, nếu một điều kiện nào đó thoả mãn thì khối lệnh trong thân câu lệnh if sẽ được thực thi, còn nếu điều kiện sai thì sẽ chuyển sang đánh giá điều kiện if tiếp theo cho đến khi kết thúc.

Luồng thực thi của khối lệnh if-else bậc thang có thể mô tả như lưu đồ sau:

Cú pháp:

1.	if (điều kiện 1) {
2.	   //khối mã được thực thi nếu điều kiện 1 là đúng
3.	} else if (điều kiện 2) {
4.	   //khối mã được thực thi nếu điều kiện 1 là sai và điều kiện 2 là đúng
5.	} else {
6.	   //khối mã được thực thi nếu điều kiện 1 và điều kiện 2 đều sai
7.	}

Ví dụ:

1.	if(time < 10){
2.	   greeting = "Good morning";
3.	}else if(time < 20){
4.	   greeting = "Good day";
5.	}else{
6.	   greeting = "Good evening";
7.	}

Trong ví dụ này, nếu giá trị của time là 9 thì điều kiện đầu tiên đúng, do đó biến greeting sẽ có giá trị là “Good morning”.

Nếu giá trị của time là 11 thì điều kiện đầu tiên không đúng, do đó chuyển sang đánh giá điều kiện của câu lệnh if tiếp theo, ở đây điều kiện time < 20 là đúng, do đó biến greeting sẽ được gán giá trị là “Good day”.

Nếu giá trị của biến time là 21 thì điều kiện đầu tiên không đúng, chuyển sang đánh giá điều kiện thứ hai cũng không đúng, do đó chuyển đến thực thi câu lệnh else cuối cùng, và kết quả biến greeting sẽ được gán giá trị là “Good evening”.

7. Cấu trúc điều kiện switch-case

Câu lệnh switch-case là một bộ lựa chọn đa hướng, nó so sánh giá trị của một biểu thức với một danh sách các hằng số nguyên hoặc hằng ký tự. Chúng ta sử dụng câu lệnh switch-case trong những trường hợp muốn phân loại luồng thực thi của chương trình dựa vào các điều kiện so sánh bằng. Khi biểu thức so sánh bằng trả về đúng thì khối lệnh tương ứng được thực thi.

Cú pháp:

1.	switch (param) {
2.	   case value1:
3.	       //khối lệnh 1
4.	   case value2:
5.	       //khối lệnh 2
6.	   case value3:
7.	       //khối lệnh 3
8.	   default:
9.	       //Khối lệnh mặc định sẽ được thực thi nếu không chọn được khối lệnh nào khác
10.	}

Trong đó param là một biểu thức. Trình thực thi sẽ so sánh giá trị của param lần lượt với giá giá trị đi theo sau các case. Nếu gặp một case mang theo giá trị bằng với giá trị của param thì các khối lệnh đi sau đó sẽ được thực thi.

Trong trường hợp không tìm thấy case nào mang giá trị khớp với param thì khối lệnh đi theo sau default sẽ được thực thi. default là một khối lệnh không bắt buộc.

Lưu ý: Cho dù là thực thi mã đi theo case hay default, lệnh switch sẽ còn tiếp tục thực thi mã của tất cả các case (hay cả mã của default) đứng sau đó, mà không cần xem xét bất cứ điều kiện gì. Quá trình đó có thể được biểu diễn bằng lưu đồ như sau:

Chúng ta có thể thấy luồng thực thi nối thẳng từ khối lệnh này tới khối lệnh khác mà không thông qua bất kỳ khối hình thoi (khối xét điều kiện) nào. Vì hình ảnh này mà tính chất thực thi này được gọi là fall-though (rơi xuyên qua) trong tiếng Anh.

Ví dụ:

1.	let switcher = 1;
2.	switch (switcher) {
3.	 case 0:
4.	   alert("Đèn sáng");
5.	 case 1:
6.	   alert("Đèn tắt");
7.	 default:
8.	   alert("Không tìm thấy công tắc");
9.	}

Mặc dù chỉ có một case mang giá trị khớp với switcher, trình duyệt sẽ thực thi mã của cả case 1 lẫn default, và kết quả là trình duyệt sẽ hiển thị 2 thông báo alert thay vì chỉ 1.

Từ khóa break

Chúng ta có thể ứng dụng sự đặc biệt trong cách thực thi của lệnh switch để dùng chung mã giữa các case, nhờ đó tạo ra được những lệnh switch ngắn gọn. Tuy nhiên để khắc phục hiện tượng luồng thực thi rơi xuyên qua tất cả các case phía sau, thay vì chỉ thực thi những mã cần thiết, chúng ta cần vận dụng từ khóa break.

Từ khóa break sẽ làm luồng thực thi ngay lập tức thoát ra khỏi câu lệnh switch hiện tại.

Từ khóa break thường được đặt làm câu lệnh cuối cùng của mỗi case, nhờ thế, hiện tượng rơi được khắc phục.

Ví dụ:

1.	let switcher = 0;
2.	switch (switcher) {
3.	   case 0:
4.	       alert("Đèn sáng");
5.	       break;
6.	   case null:
7.	   case undefined:
8.	       alert("Không tìm thấy công tắc");
9.	   case 1:
10.	   default:
11.	       alert("Đèn tắt");
12.	}

Nhờ có break, giờ đây chỉ có alert “Đèn sáng” hiện lên. Nhờ sự rơi, nếu switcher  mang giá trị là 1 thì alert “Đèn tắt” vẫn hiện lên. Nếu chúng ta thực thi đoạn mã trên với giá trị switcher là null hay undefined, sẽ có 2 alert hiện lên.

Lưu ý:

Lệnh switch khớp giá trị của param với các case bằng toán tử === chứ không phải ==.

Ví dụ:

1.	let switcher = "0";
2.	switch (switcher) {
3.	   case 0:
4.	       alert("Đèn sáng");
5.	       break;
6.	   case null:
7.	   case undefined:
8.	       alert("Không tìm thấy công tắc");
9.	   case 1:
10.	   default:
11.	       alert("Đèn tắt");
12.	}

Đoạn mã trên sẽ khớp giá trị của switcher với case default thay vì case 0 như chúng ta thường nghĩ.

8. Bài thực hành

Bài 1: Kiểm tra năm nhuận

Mục tiêu:

Luyện tập sử dụng cấu trúc điều kiện if.

Mô tả:

Trong phần này, chúng ta sẽ phát triển một ứng dụng nhằm kiểm tra xem một năm có phải là năm nhuận hay không. Ứng dụng cho phép người dùng nhập vào một năm, sau đó sẽ đưa ra thông báo là năm đó là năm nhuận hay không phải là năm nhuận. Năm nhuận là một năm đặc biệt, được cộng thêm một ngày để giữ cho lịch được đồng bộ với lịch thiên văn.

Cách xác định năm nhuận: Những năm chia hết cho 4 là năm nhuận, ngoại trừ những năm chia hết cho 100 mà không chia hết cho 400. Từ đó, có thể rút gọn thành các quy tắc xác định năm nhuận: “Những năm chia hết cho 4 mà không chia hết cho 100 là năm nhuận.Những năm chia hết cho 100 mà không chia hết cho 400 thì KHÔNG PHẢI là năm nhuận.Những năm chia hết đồng thời cho 100 và 400 là năm nhuận”.

Hướng dẫn:

Bước 1: Tạo dự án mới với file index.html và khối lệnh JavaScript

Bước 2: Nhập dữ liệu từ bàn phím

1.	let year = parseInt(prompt("Enter a year")); 

Bước 3: Phân loại và hiển thị kết quả

1.	if (year % 4 == 0) {
2.	 if (year % 100 == 0) {
3.	   if (year % 400 == 0) {
4.	     alert(year + " is a leap year");
5.	   } else {
6.	     alert(year + " is NOT a leap year");
7.	   }
8.	 } else {
9.	   alert(year + " is a leap year");
10.	 }
11.	} else {
12.	 alert(year + " is NOT a leap year");
13.	}

Bước 4: Chạy và quan sát kết quả.

Sử dụng các năm sau để kiểm tra tính đúng đắn của chương trình:

Lưu ý:

Với các điều kiện như trên, chúng ta có thể chỉnh sửa để mã nguồn tốt hơn như sau:

1.	let year = parseInt(prompt("Enter a year"));
2.	let isLeapYear = false;
3.	if (year % 4 == 0) {
4.	 if (year % 100 == 0) {
5.	   if (year % 400 == 0) {
6.	     isLeapYear = true;
7.	   }
8.	 } else {
9.	   isLeapYear = true;
10.	 }
11.	}
12.	if (isLeapYear) {
13.	 alert(year + " is a leap year");
14.	} else {
15.	 alert(year + " is NOT a leap year");
16.	}

Đảm bảo clean code:

Trong đoạn mã trên, các điều kiện bên trong các câu lệnh if sẽ là khó hiểu, bởi vì bản thân các biểu thức không trực tiếp nói rõ ý nghĩa của nó. Chúng ta có thể sử dụng kỹ thuật tách biến để các câu lệnh này dễ hiểu hơn. Ví dụ:

1.	let isLeapYear = false;
2.	 
3.	let isDivisibleBy4 = year % 4 == 0;
4.	if (isDivisibleBy4) {
5.	 let isDivisibleBy100 = year % 100 == 0;
6.	 if (isDivisibleBy100) {
7.	   let isDivisibleBy400 = year % 400 == 0;
8.	   if (isDivisibleBy400) {
9.	     isLeapYear = true;
10.	   }
11.	 } else {
12.	   isLeapYear = true;
13.	 }
14.	}
15.	 
16.	if (isLeapYear) {
17.	 alert(year + " is a leap year");
18.	} else {
19.	 alert(year + " is NOT a leap year");
20.	}

Bài 2: Luyện tập với cấu trúc if…else

Mục tiêu:

Luyện tập sử dụng cấu trúc if/else.

Mô tả:

Sử dụng cấu trúc if…else, viết chương trình nhập vào một chuỗi câu trả lời cho câu hỏi “What is the “official” name of JavaScript?”. Nếu câu trả lời nhập vào là “ECMAScript”,  thì hiển thị thông báo: “Right!”, ngược lại hiển thị thông báo: “Didn’t know? ECMAScript!”

Lưu đồ:

Hướng dẫn:

Bước 1: Tạo file index.html

Bước 2: Thêm thẻ <script> thực hiện viết các mã JavaScript

Bước 3: Khai báo biến value nhận giá trị được nhập vào từ hộp thoại

1.	let value = prompt('What is the "official" name of JavaScript?', '');

Bước 4: Sử dụng cấu trúc if…else kiểm tra giá trị của value

1.	if (value == 'ECMAScript') {
2.	 alert('Right!');
3.	} else {
4.	 alert("You don't know? ECMAScript!");
5.	}

Bước 5: Thực thi chương trình. Quan sát kết quả.

Bài 3: Luyện tập với cấu trúc if…else…if

Mục tiêu

Luyện tập sử dụng cấu trúc if…else…if

Mô tả

Viết chương trình kiểm tra đăng nhập hệ thống của người dùng theo yêu cầu sau:

• Yêu cầu người dùng nhập tên từ bàn phím.
• Nếu tên nhập vào là “Admin” thì yêu cầu nhập mật khẩu.
• Nếu mật khẩu là “TheMaster” thì in ra chuỗi “Welcome”.
• Nếu mật khẩu nhập vào là null in ra chuỗi “Canceled”.
• Còn lại in ra chuỗi “Wrong password”.
• Nếu tên nhập vào là null in ra chuỗi “Canceled”.
• Còn lại in ra chuỗi “I don’t know you”.

Hướng dẫn

Bước 1: Tạo file login.html

Bước 2: Thêm thẻ <script> thực hiện viết các mã JavaScript

Bước 3: Tạo biến userName nhận giá trị nhập vào từ hộp thoại

1.	let userName = prompt("Who's there?", '');

Bước 4: Kiểm tra giá trị của userName

1.	if (userName == 'Admin') {
2.	   //code vào đây
3.	} else if (userName == null) {
4.	   alert('Canceled');
5.	} else {
6.	   alert("I don't know you");
7.	}

Bước 5: Nếu userName là “Admin”. Khai báo biến pass nhận giá trị nhập vào từ hộp thoại.

1.	let pass = prompt('Password?', '');

Bước 6: Kiểm tra pass

1. if (pass == ‘TheMaster’) {
2.    alert(‘Welcome!’);
3. } else if (pass == null) {
4.    alert(‘Canceled.’);
5. } else {
6.    alert(‘Wrong password’);
7. }

Bước 7: Thực thi chương trình. Quan sát kết quả.

Bài 4: Luyện tập với cấu trúc switch…case

Mục tiêu:

Luyện tập với cấu trúc switch…case

Mô tả:

Viết lại cấu trúc if sau thành cấu trúc switch…case

1.	if (browser == 'Edge') {
2.	   alert("You've got the Edge!");
3.	} else if (browser == 'Chrome' || browser == 'Firefox' || browser == 'Safari' || browser == 'Opera') {
4.	   alert('Okay we support these browsers too');
5.	} else {
6.	   alert('We hope that this page looks ok!');
7.	}

Hướng dẫn

Cấu trúc if được viết lại với cấu trúc switch…case như sau:

1.	switch (browser) {
2.	   case 'Edge':
3.	       alert("You've got the Edge!");
4.	       break;
5.	   case 'Chrome':
6.	   case 'Firefox':
7.	   case 'Safari':
8.	   case 'Opera':
9.	       alert('Okay we support these browsers too');
10.	       break;
11.	   default:
12.	       alert('We hope that this page looks ok!');
13.	}
1.	switch (browser) {
2.	   case 'Edge':
3.	       alert("You've got the Edge!");
4.	       break;
5.	   case 'Chrome':
6.	   case 'Firefox':
7.	   case 'Safari':
8.	   case 'Opera':
9.	       alert('Okay we support these browsers too');
10.	       break;
11.	   default:
12.	       alert('We hope that this page looks ok!');
13.	}

Bài 5: Luyện tập với cấu trúc switch…case

Mục tiêu:

Luyện tập với cấu trúc switch…case.

Mô tả:

Viết lại cấu trúc if sau thành cấu trúc switch…case.

1.	let a = prompt('a?', '');
2.	if (a == 0) {
3.	   alert(0);
4.	}
5.	if (a == 1) {
6.	   alert(1);
7.	}
8.	if (a == 2 || a == 3) {
9.	   alert('2,3');
10.	}

Hướng dẫn:

Cấu trúc if được viết lại với cấu trúc switch…case như sau:

1.	let a = prompt('a?', '');
2.	switch (a) {
3.	   case 0:
4.	       alert(0);
5.	       break;
6.	   case 1:
7.	       alert(1);
8.	       break;
9.	   case 2:
10.	   case 3:
11.	       alert('2,3');
12.	       break;
13.	}

Bài 6: Luyện tập với cấu trúc if…else

Mục tiêu:

Luyện tập với cấu trúc if…else.

Mô tả:

Sử dụng cấu trúc if…else, nhập vào một số, kiểm tra giá trị của số nhập vào.

• Nếu số nhập vào lớn hơn 0 hiển thị 1
• Nếu số nhập vào nhỏ hơn 0 thì hiển thị -1
• Còn lại hiển thị 0

Hướng dẫn:

Bước 1: Tạo file sign.html

Bước 2: Khai báo biến value nhận giá trị đầu vào từ hộp thoại, mặc định không nhập gì value = 0

1.	let value = prompt('Type a number', 0);

Bước 3: Viết khối if…else..if

1.	if (value > 0) {
2.	   alert(1);
3.	} else if (value < 0) {
4.	   alert(-1);
5.	} else {
6.	   alert(0);
7.	}

Bước 4: Thực thi chương trình. Nhập giá trị 0, -5, 5. Quan sát kết quả nhận được

Bước 5: Thay thế cấu trúc if bằng cấu trúc switch…case. Làm lại các bước như trên.

Bài 7: Tính tổng 2 số

Mục tiêu:

Luyện tập sử dụng cấu trúc điều kiện với toán tử “?”, ” :”

Mô tả:

Hãy viết chương trình nhập vào giá trị cho a và b. Tính tổng a và b, nếu tổng nhỏ hơn 4, hiển thị chuỗi Below, ngược lại hiển thị Over. Lưu ý sử dụng toán tử ? :

Hướng dẫn:

Bước 1: Tạo file add.html

Bước 2: Thêm thẻ <script> thực hiện viết các mã JavaScript

1.	<!DOCTYPE html>
2.	<html>
3.	<body>
4.	    <script>
5.	    //code vào đây
6.	    </script>
7.	</body>
8.	</html>

Bước 3: Khai báo biến a, b nhập vào giá trị cho a, b từ hộp thoại

1.	let a = prompt("a: ");
2.	let b = prompt("b: ");

Bước 4: Khai báo biến result lưu kết quả

Bước 5: Thực thi chương trình. Quan sát kết quả.

Bài 8: Luyện tập với chuỗi

Mục tiêu:

Luyện tập với chuỗi.

Mô tả:

 Viết chương trình nhập vào giá trị cho chuỗi message.

• Nếu giá trị nhập vào là Employee thì hiển thị chuỗi Hello.
• Còn lại nếu giá trị nhập vào là Director thì hiển thị chuỗi Greetings
• Còn lại nếu giá trị nhập vào chuỗi rỗng thì hiển thị No login
• Còn lại hiển thị chuỗi rỗng

Sử dụng toán tử ? : để viết chương trình với cấu trúc điều kiện như sau:

1.	 let message;
2.	       if (login == 'Employee') {
3.	           message = 'Hello';
4.	       } else if (login == 'Director') {
5.	           message = 'Greetings';
6.	       } else if (login == '') {
7.	           message = 'No login';
8.	       } else {
9.	           message = '';
10.	       }

Hướng dẫn:

Bước 1: Tạo file employee.html

Bước 2: Thêm thẻ <script> thực hiện viết các mã JavaScript

1.	<!DOCTYPE html>
2.	<html>
3.	<body>
4.	   <script>
5.	   //code vào đây
6.	   </script>
7.	</body>
8.	</html>

Bước 3: Khai báo biến message

1.	let message = (login == 'Employee') ?
2.	           'Hello' :
3.	           (login == 'Director') ?
4.	               'Greetings' :
5.	               (login == '') ?
6.	                   'No login' :
7.	                   '';

Bước 4: Hiển thị thông báo

1.	alert(message);

Bước 5: Thực thi chương trình. Quan sát kết quả.

Xem tiếp>> Chương 2: Hien thi du lieu

Có thể bạn quan tâm>> Cam nang lap trinh danh cho nguoi moi bat dau