คำสั่งเงื่อนไขใน TypeScript
ในบทความนี้ เราจะอธิบายคำสั่งเงื่อนไขใน TypeScript
YouTube Video
คำสั่ง If ใน TypeScript
ใน TypeScript คำสั่ง if ใช้สำหรับแยกการทำงานโดยจะรันโค้ดเมื่อเงื่อนไขที่กำหนดเป็น true และไม่รันเมื่อเงื่อนไขเป็น false คำสั่ง if มีไวยากรณ์เหมือนกับใน JavaScript และใช้คุณสมบัติความปลอดภัยของประเภทใน TypeScript สำหรับการแยกเงื่อนไข
ไวยกรณ์พื้นฐาน
ไวยากรณ์พื้นฐานของคำสั่ง if มีดังนี้
1if (condition) {
2 // Code to execute if the condition is true
3} else if (anotherCondition) {
4 // Code to execute if the first condition is false
5 // and the another condition is true
6} else {
7 // Code to execute if all conditions are false
8}- หาก
conditionเป็นtrueโค้ดในบล็อกถัดไปจะถูกรัน - หาก
conditionเป็นfalseและanotherConditionเป็นtrueโค้ดในบล็อกถัดไปจะถูกรัน - หากไม่มีเงื่อนไขใดๆ เป็น
trueโค้ดในบล็อกelseท้ายสุดจะถูกรัน
ตัวอย่างที่ 1: คำสั่ง if-else พื้นฐาน
ในตัวอย่างต่อไปนี้ จะตรวจสอบว่า ตัวแปร x มีค่าเท่ากับหรือมากกว่า 10 หรือไม่ และจะแสดงผลลัพธ์
1let x: number = 15;
2
3if (x >= 10) {
4 console.log("x is 10 or greater");
5} else {
6 console.log("x is less than 10");
7}
8// Outputs: x is 10 or greater
ตัวอย่างที่ 2: คำสั่ง if-else if-else
หากต้องการตรวจสอบเงื่อนไขหลายๆ แบบ ให้ใช้ else if เพื่อเพิ่มโครงสร้างแยกเงื่อนไข
1let score: number = 85;
2
3if (score >= 90) {
4 console.log("Excellent");
5} else if (score >= 70) {
6 console.log("Passed");
7} else {
8 console.log("Failed");
9}
10// Outputs: Passed
ตัวอย่างที่ 3: คำสั่ง if พร้อมการตรวจสอบประเภทข้อมูล
สามารถใช้คุณสมบัติการตรวจสอบประเภทใน TypeScript เพื่อแยกเงื่อนไขสำหรับประเภทข้อมูลเฉพาะได้ ตัวอย่างเช่น ตรวจสอบชนิดของตัวแปรด้วยตัวดำเนินการ typeof และดำเนินการประมวลผลที่เหมาะสม
1let value: any = "Hello";
2
3if (typeof value === "string") {
4 console.log("The value is a string: " + value);
5} else if (typeof value === "number") {
6 console.log("The value is a number: " + value);
7} else {
8 console.log("The value is of another type");
9}
10// Outputs: "The value is a string: Hello"
ตัวอย่างที่ 4: การใช้คำสั่ง if ซ้อนกัน
คุณสามารถซ้อนคำสั่ง if เพื่อตรวจสอบเงื่อนไขที่ซับซ้อนได้
1let age: number = 25;
2let isMember: boolean = true;
3
4if (age >= 18) {
5 if (isMember) {
6 console.log("You are a member and 18 years old or older");
7 } else {
8 console.log("You are not a member but 18 years old or older");
9 }
10} else {
11 console.log("You are under 18 years old");
12}
13// Output
14// You are a member and 18 years old or older
เครื่องหมายตัวเลือกสามทาง (เครื่องหมายเงื่อนไข)
ไวยากรณ์
1condition ? valueIfTrue : valueIfFalseหากคุณต้องการเขียนคำสั่ง if อย่างกระชับยิ่งขึ้น คุณสามารถใช้เครื่องหมายตัวเลือกสามทาง
ตัวอย่าง
1const number: number = 7;
2const result: string = number % 2 === 0 ? "Even" : "Odd";
3console.log(result); // "Odd"
ในกรณีนี้ เนื่องจาก number คือ 7 จะปรากฏคำว่า Odd
สรุป
- คำสั่ง
ifเป็นโครงสร้างควบคุมพื้นฐานที่ใช้กำหนดการดำเนินการตามเงื่อนไข - คุณสามารถจัดการกับหลายเงื่อนไขได้โดยใช้
else if - โดยการใช้
typeofคุณสามารถใช้ประโยชน์จากประเภทข้อมูลใน TypeScript เพื่อแยกเงื่อนไขได้ - การจัดการเงื่อนไขที่ซับซ้อนสามารถทำได้ด้วยคำสั่ง
ifซ้อนกัน - คุณยังสามารถใช้เครื่องหมายตัวเลือกสามทางเพื่อเขียนช่วงทางเลือกแบบกระชับได้
ใน TypeScript การใช้คำสั่ง if โดยคำนึงถึงความปลอดภัยของประเภทจะช่วยปรับปรุงความน่าเชื่อถือของโค้ด
คำสั่ง Switch ใน TypeScript
คำสั่ง switch ใน TypeScript เป็นโครงสร้างควบคุมที่ใช้แยกโค้ดตามหลายเงื่อนไข แทนที่จะใช้คำสั่ง if-else if เพื่อประเมินหลายเงื่อนไข คุณสามารถใช้คำสั่ง switch เพื่อเขียนลอจิกการแยกตามค่าที่ระบุได้อย่างกระชับ
ไวยกรณ์พื้นฐาน
1switch (expressionToEvaluate) {
2 case value1:
3 // Code to execute if the expression evaluates to value1
4 break;
5 case value2:
6 // Code to execute if the expression evaluates to value2
7 break;
8 default:
9 // Code to execute if none of the conditions match
10}ในคำสั่ง switch หากค่าที่ระบุใน case ตรงกับค่าที่ได้รับการประเมิน บล็อค case จะถูกรัน โปรดระวังว่าหากไม่มีคำสั่ง break บล็อค case ถัดไปจะถูกรันต่อเนื่อง บล็อก default จะถูกดำเนินการหากไม่มีคำสั่ง case ใดที่ตรงกัน
ตัวอย่างที่ 1: คำสั่ง switch พื้นฐาน
ในตัวอย่างด้านล่าง จะมีการป้อนตัวเลขที่แทนวันในสัปดาห์ (0 ถึง 6) และผลลัพธ์จะออกมาเป็นชื่อวันที่สอดคล้องกับค่านั้น
1let day: number = 3;
2
3switch (day) {
4 case 0:
5 console.log("Sunday");
6 break;
7 case 1:
8 console.log("Monday");
9 break;
10 case 2:
11 console.log("Tuesday");
12 break;
13 case 3:
14 console.log("Wednesday");
15 break;
16 case 4:
17 console.log("Thursday");
18 break;
19 case 5:
20 console.log("Friday");
21 break;
22 case 6:
23 console.log("Saturday");
24 break;
25 default:
26 console.log("Invalid day");
27}
28// Outputs: Wednesday
ตัวอย่างที่ 2: ตัวอย่างการใช้ default
default มีประโยชน์เพราะจะทำงานเมื่อไม่มีคำสั่ง case ใดตรงกัน ทำให้สามารถจัดการค่าที่ไม่ได้คาดไว้ได้
1let statusText: string = "pending";
2
3switch (statusText) {
4 case "success":
5 console.log("Operation succeeded");
6 break;
7 case "error":
8 console.log("An error occurred");
9 break;
10 case "pending":
11 console.log("Processing");
12 break;
13 default:
14 console.log("Unknown status");
15}
16// Outputs: Processing
ตัวอย่างที่ 3: การดำเนินการกระบวนการเดียวกันสำหรับหลาย case
หากต้องการดำเนินการแบบเดียวกันสำหรับคำสั่ง case หลายตัว คุณสามารถระบุ case เหล่านั้นต่อเนื่องกันได้
1let fruit: string = "apple";
2
3switch (fruit) {
4 case "apple":
5 case "banana":
6 case "orange":
7 console.log("This is a fruit");
8 break;
9 default:
10 console.log("This is not a fruit");
11}
12// Outputs: This is a fruit
ตัวอย่างที่ 4: พฤติกรรมเมื่อไม่ใช้ break
การละเว้น break จะส่งผลให้เกิดพฤติกรรม "fall-through" ซึ่งจะทำให้ case ถัดไปถูกดำเนินการด้วย
1let rank: number = 1;
2
3switch (rank) {
4 case 1:
5 console.log("Gold");
6 case 2:
7 console.log("Silver");
8 case 3:
9 console.log("Bronze");
10 default:
11 console.log("Not ranked");
12}
13// Outputs:
14// Gold
15// Silver
16// Bronze
17// Not ranked
ในลักษณะนี้ หลังจากที่ case ตรงกัน การดำเนินการใน case ถัดไปจะเกิดขึ้นด้วย ดังนั้นจึงมักใช้ break เพื่อป้องกันการ fall-through ที่ไม่จำเป็น
สรุป
- คำสั่ง
switchเป็นโครงสร้างควบคุมที่ช่วยให้เขียนตรรกะแตกแขนงตามเงื่อนไขหลายประการได้อย่างกระชับ - แต่ละ
caseควรจบกระบวนการอย่างชัดเจนโดยใช้break - บล็อก
defaultจะถูกดำเนินการหากไม่มีcaseใดตรงกัน - สามารถดำเนินการเดียวกันสำหรับหลาย
caseได้เช่นกัน
คำสั่ง switch ใน TypeScript มีประโยชน์ในการจัดการเงื่อนไขหลายประการอย่างมีประสิทธิภาพและคงความอ่านง่ายของโค้ด
คุณสามารถติดตามบทความข้างต้นโดยใช้ Visual Studio Code บนช่อง YouTube ของเรา กรุณาตรวจสอบช่อง YouTube ด้วย