Instrukcje warunkowe w TypeScript

W tym artykule wyjaśnimy instrukcje warunkowe w TypeScript.

YouTube Video

Instrukcje warunkowe „if” w TypeScript

W TypeScript instrukcja if wykonuje rozgałęzienia, które uruchamiają kod, jeśli określony warunek jest true, i nie uruchamiają go, jeśli warunek jest false. Instrukcja if ma taką samą składnię jak w JavaScript i wykorzystuje mechanizm bezpieczeństwa typów TypeScript do wykonywania rozgałęzień warunkowych.

Podstawowa składnia

Podstawowa składnia instrukcji if jest następująca.

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}

• Jeśli condition jest true, kod w poniższym bloku zostanie wykonany.
• Jeśli condition jest false i anotherCondition jest true, kod w poniższym bloku zostanie wykonany.
• Jeśli żaden z warunków nie jest true, kod w końcowym bloku else zostanie wykonany.

Przykład 1: Podstawowe użycie if-else

W poniższym przykładzie sprawdzane jest, czy zmienna x wynosi 10 lub więcej, a następnie wypisywany jest wynik.

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

Przykład 2: Użycie if-else if-else

Aby sprawdzić wiele warunków, użyj else if, aby dodać rozgałęzienia.

 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

Przykład 3: Instrukcja if z kontrolą typu

Możliwe jest również wykonywanie rozgałęzień warunkowych dla określonych typów, korzystając z funkcji kontroli typów w TypeScript. Na przykład sprawdź typ zmiennej za pomocą operatora typeof i wykonaj odpowiednie przetwarzanie.

 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"

Przykład 4: Zagnieżdżone instrukcje if

Możesz również zagnieżdżać instrukcje if, aby sprawdzać złożone warunki.

 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

Operator trójargumentowy (operator warunkowy)

Składnia

1condition ? valueIfTrue : valueIfFalse

Jeśli chcesz napisać instrukcję if w bardziej zwięzły sposób, możesz użyć operatora trójargumentowego.

Przykład

1const number: number = 7;
2const result: string = number % 2 === 0 ? "Even" : "Odd";
3console.log(result); // "Odd"

W tym przypadku, ponieważ number wynosi 7, zostanie wyświetlone Odd.

Podsumowanie

• Instrukcja if jest podstawową strukturą sterującą, która pozwala określić, które działanie wykonać w oparciu o określone warunki.
• Możesz obsługiwać wiele warunków, korzystając z else if.
• Korzystając z typeof, możesz wykorzystać typy TypeScript do warunkowego rozgałęzienia.
• Obsługa złożonych warunków jest możliwa dzięki zagnieżdżonym instrukcjom if.
• Możesz również użyć operatora trójargumentowego, aby zwięźle napisać rozgałęzienia warunkowe.

W TypeScript używanie instrukcji if z uwzględnieniem bezpieczeństwa typów może poprawić niezawodność kodu.

Instrukcje „switch” w TypeScript

Instrukcja switch w TypeScript jest strukturą sterującą używaną do rozgałęzienia kodu na podstawie wielu warunków. Zamiast używać instrukcji if-else if, aby ocenić wiele warunków, możesz użyć instrukcji switch, aby zwięźle napisać logikę rozgałęzienia opartą na konkretnych wartościach.

Podstawowa składnia

 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}

W instrukcji switch, jeśli wartość określona w case pasuje do ocenianego wyrażenia, wykonywany jest blok case. Uważaj, ponieważ jeśli nie ma instrukcji break, kolejny blok case będzie wykonywany kolejno. Blok default jest wykonywany, jeśli żadne z instrukcji case nie pasują.

Przykład 1: Podstawowa instrukcja switch

W poniższym przykładzie podano liczbę reprezentującą dzień tygodnia (od 0 do 6), a na jej podstawie wypisywana jest odpowiednia nazwa dnia.

 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

Przykład 2: Przykład z użyciem default

default jest przydatne, ponieważ uruchamia się, gdy żadne z instrukcji case nie pasują, co pozwala obsłużyć nieoczekiwane wartości.

 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

Przykład 3: Wykonanie tego samego procesu dla kilku instrukcji case

Jeśli chcesz wykonać to samo działanie dla kilku instrukcji case, możesz zapisać je kolejno.

 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

Przykład 4: Zachowanie po pominięciu break

Pominięcie break prowadzi do zachowania "fall-through", w którym następna instrukcja case również jest wykonywana.

 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

W ten sposób, gdy jedna instrukcja case pasuje, następna również jest wykonywana, więc zazwyczaj używa się break, aby temu zapobiec.

Podsumowanie

• Instrukcja switch to struktura sterująca, która pozwala na zwięzłe napisanie logiki warunkowej opierającej się na wielu warunkach.
• Każda instrukcja case powinna jawnie kończyć proces za pomocą break.
• Blok default jest wykonywany, jeśli żadne z instrukcji case nie pasują.
• Możliwe jest również wykonanie tej samej operacji dla kilku instrukcji case.

Instrukcja switch w TypeScript jest przydatna do efektywnego obsługiwania wielu warunków przy zachowaniu czytelności kodu.

Możesz śledzić ten artykuł, korzystając z Visual Studio Code na naszym kanale YouTube. Proszę również sprawdzić nasz kanał YouTube.

YouTube Video