Computer >> Máy Tính >  >> Lập trình >> Javascript

JavaScript Switch Case:Hướng dẫn từng bước

Trường hợp chuyển đổi JavaScript là một if else nhiều tuyên bố. Nó sử dụng một biểu thức điều kiện giống như một câu lệnh if nhưng có thể có nhiều điều kiện — hoặc các trường hợp — có thể khớp với kết quả của biểu thức để chạy các khối mã khác nhau.


Câu lệnh điều kiện là một phần thiết yếu của lập trình và được sử dụng để điều khiển luồng chương trình máy tính. Dạng câu lệnh điều kiện phổ biến nhất trong JavaScript là “if”“if...else” khối mã, chỉ có thể được sử dụng để chạy mã nếu một điều kiện hoặc tập hợp các điều kiện nhất định được đáp ứng.

Có một câu lệnh điều kiện khác được tích hợp trong JavaScript có thể được sử dụng để đánh giá một biểu thức dựa trên nhiều điều kiện:câu lệnh switch case. Các câu lệnh chuyển đổi trường hợp có thể được sử dụng để kiểm tra xem một điều kiện nhất định có được đáp ứng với nhiều trường hợp hay không và sẽ chạy các khối mã nơi điều kiện đó được đáp ứng.

Trong hướng dẫn này, chúng ta sẽ thảo luận về cách sử dụng câu lệnh viết hoa của biểu thức switch JavaScript để tạo các câu lệnh có điều kiện. Chúng ta cũng sẽ khám phá cách sử dụng nhiều trường hợp với câu lệnh switch để tạo các biểu thức nâng cao hơn.

Trình làm mới câu lệnh có điều kiện JavaScript

Các câu lệnh điều kiện cho phép bạn chạy mã nếu một điều kiện nhất định được đáp ứng và không thực thi một khối mã nếu điều kiện đó không được đáp ứng. Câu lệnh điều kiện đánh giá liệu một điều kiện có được đáp ứng hay không dựa trên kết quả của một câu lệnh đúng và sai.

Tuyên bố có điều kiện có thể hữu ích nếu bạn muốn xác minh rằng người dùng đã điền vào tất cả các biểu mẫu trên trang đặt hàng hoặc để hiển thị thông báo cho người dùng về ưu đãi sản phẩm chỉ khi họ đã đăng nhập.

Trong JavaScript, dạng câu lệnh điều kiện phổ biến nhất là “if” tuyên bố. “if” các câu lệnh đánh giá xem một câu lệnh là đúng hay sai và chỉ chạy nếu câu lệnh đánh giá là true. Dưới đây là một ví dụ về câu lệnh if trong JavaScript:

var age = 17;

if (age >= 16) {
	console.log("You are aged 16 or over!");
}

Khi chúng tôi chạy mã của mình, kết quả sau được trả về:“You are aged 16 or over!”

81% người tham gia cho biết họ cảm thấy tự tin hơn về triển vọng công việc công nghệ của mình sau khi tham gia chương trình đào tạo. Kết hợp với bootcamp ngay hôm nay.

Sinh viên tốt nghiệp bootcamp trung bình dành ít hơn sáu tháng để chuyển đổi nghề nghiệp, từ khi bắt đầu bootcamp đến khi tìm được công việc đầu tiên của họ.

“if” câu lệnh cũng đi kèm với “else if” câu lệnh có thể được sử dụng để kiểm tra nhiều điều kiện. Nếu bạn muốn tìm hiểu thêm về câu lệnh if và else trong JavaScript, bạn có thể làm như vậy bằng cách làm theo hướng dẫn của chúng tôi về câu lệnh “if… else”.

Bây giờ chúng ta đã biết những điều cơ bản về câu lệnh điều kiện trong JavaScript, chúng ta có thể khám phá “switch case” tuyên bố.

Trường hợp chuyển đổi JavaScript

JavaScript “switch” câu lệnh đánh giá một câu lệnh và thực thi một khối mã nếu câu lệnh đó đánh giá là true. “switch” các câu lệnh hoạt động theo cách tương tự như “if” trong đó chúng kiểm tra xem một câu lệnh có đúng không và chạy nếu câu lệnh đó bằng true.

“switch” câu lệnh được viết bằng cú pháp sau:

switch (statement) {
	case a:
		// Run code
		break;
	case b:
		// Run code
		break;
	default:
		// Run code
		break;
};

Có rất nhiều điều đang diễn ra ở đây, vì vậy chúng ta hãy chia nhỏ nó ra. Đây là quy trình mà chương trình của chúng tôi sẽ tuân theo khi đọc “switch” của chúng tôi tuyên bố:

  • Biểu thức switch được đánh giá khi chạy câu lệnh.
  • Giá trị của câu lệnh được so sánh với từng trường hợp.
  • Nếu một trường hợp khớp với tuyên bố của chúng tôi, thì khối mã liên quan sẽ được chạy.
  • Nếu không trường hợp nào của chúng tôi được đáp ứng, mã trong “default” khối trường hợp sẽ thực thi.

Hãy sử dụng một ví dụ để minh họa cách hoạt động của điều này trong thực tế. Vì vậy, giả sử bạn là chủ cửa hàng cà phê muốn tạo một chương trình để người dùng có thể dễ dàng kiểm tra giá đồ uống phổ biến của bạn. Trong ví dụ của chúng tôi, chúng tôi sẽ đánh giá đồ uống mà người dùng chọn dựa trên danh sách các loại cà phê của chúng tôi, sau đó in ra giá đồ uống họ đã chọn.

Đây là mã chúng tôi sẽ sử dụng để cho phép người dùng kiểm tra giá đồ uống phổ biến của bạn:

const drink_name = "Americano";

switch (drink_name) {
	case "Americano":
		console.log("The price of an Americano is $2.60");
		break;
	case "Cappuccino":
		console.log("The price of a cappuccino is $2.75");
		break;
	case "Macchiato":
		console.log("The price of a macchiato is $3.00");
		break;
	case "Espresso":
		console.log("The price of an espresso is $2.40");
		break;
	default:
		console.log("This drink is not available");
}

Khi chúng tôi chạy chương trình của mình với biến “drink_name” bằng “Americano,” phần sau được trả lại:

The price of an Americano is $2.60.

Nếu chúng tôi đặt “drink_name” tương đương với một đồ uống khác, giá tương ứng cho đồ uống đó sẽ xuất hiện. Ngoài ra, nếu chúng tôi đã nhập tên đồ uống không hợp lệ, mã của chúng tôi sẽ trả về nội dung của “default” của chúng tôi , trong trường hợp này là một thông báo cho biết “This drink is not available.”

Lưu ý rằng chúng tôi thêm một “break” từ khóa ở cuối mỗi câu lệnh. Nếu chúng tôi không bao gồm một tuyên bố ngắt quãng, chương trình của chúng tôi sẽ tiếp tục đánh giá các tuyên bố ngay cả sau khi một tuyên bố đã được đáp ứng. Điều này không hiệu quả và chúng tôi sử dụng “break case” từ khóa để đảm bảo rằng khi biểu thức của chúng tôi được đáp ứng, chương trình của chúng tôi sẽ ngừng tìm kiếm thông qua các trường hợp.

Chuyển nhiều trường hợp JavaScript

Trong ví dụ trên, chúng tôi đã sử dụng một trường hợp duy nhất cho mỗi biểu thức và mỗi biểu thức có một đầu ra khác nhau. Nhưng điều gì sẽ xảy ra nếu chúng ta muốn có nhiều trường hợp mang lại cùng một đầu ra?

Giả sử nhân viên pha cà phê của chúng tôi đã thêm hai loại đồ uống mới vào thực đơn và những đồ uống đó có giá tương đương với một ly macchiato. Thay vì viết nhiều trường hợp mới với các khối mã riêng của chúng, chúng tôi có thể sử dụng nhiều hơn một “case” cho mỗi khối mã.

Chúng ta sẽ sử dụng ví dụ trên để minh họa cách sử dụng nhiều trường hợp. Tuy nhiên, trong ví dụ này, chúng tôi sẽ thay đổi “The price of [drink name] is [price].” thành “The price of this drink is [price].” để chúng ta có thể sử dụng lại các câu lệnh console.log () của mình.

Chúng tôi cũng sẽ bổ sung thêm hai loại đồ uống mới, latte và mocha, mỗi loại có giá $ 3,00 (giống như macchiato).

Đây là mã sửa đổi của chúng tôi bao gồm các loại đồ uống mới của chúng tôi:

const drink_name = "Mocha";

switch (drink_name) {
	case "Americano":
		console.log("The price of this drink is $2.60");
		break;
	case "Cappuccino":
		console.log("The price of this drink is $2.75");
		break;
	case "Latte":
	case "Mocha":
	case "Macchiato":
		console.log("The price of this drink is $3.00");
		break;
	case "Espresso":
		console.log("The price of this drink is $2.40");
		break;
	default:
		console.log("This drink is not available");
}

Khi chúng tôi chạy mã ở trên với “drink_name” biến bằng “Mocha,” phản hồi sau được trả lại:

The price of this drink is $3.00.

Như bạn có thể thấy, chương trình của chúng tôi nhận thấy rằng “Mocha” được liệt kê là một trường hợp và nó đã chạy mã trong khối liên quan.

Kết luận

“switch” câu lệnh điều kiện có thể được sử dụng để đánh giá một biểu thức và trả về một giá trị tùy thuộc vào việc liệu biểu thức đó có được đáp ứng hay không. Câu lệnh switch rất hữu ích nếu bạn muốn đánh giá một câu lệnh dựa trên nhiều kết quả có thể xảy ra.

Trong hướng dẫn này, chúng tôi đã thảo luận những điều cơ bản về câu lệnh điều kiện trong JavaScript. Sau đó, chúng tôi khám phá cách sử dụng “switch”“case” và xem qua ví dụ về cách sử dụng nhiều “case” câu lệnh trong “switch” khối.

Bây giờ bạn có thông tin cần thiết để sử dụng câu lệnh JavaScript "switch case" như một chuyên gia!