Declarações Condicionais em TypeScript

Neste artigo, iremos explicar as declarações condicionais no TypeScript.

YouTube Video

Declarações If no TypeScript

No TypeScript, uma declaração if realiza um desvio que executa o código se uma condição especificada for true e não o executa se a condição for false. A declaração if tem a mesma sintaxe que no JavaScript e utiliza a segurança de tipos do TypeScript para realizar desvios condicionais.

Sintaxe Básica

A sintaxe básica da declaração if é a seguinte.

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}

• Se a condition for true, o código no bloco seguinte será executado.
• Se a condition for false e anotherCondition for true, o código no bloco seguinte será executado.
• Se nenhuma das condições for true, o código no bloco final else será executado.

Exemplo 1: Declaração básica if-else

No exemplo a seguir, verifica se a variável x é 10 ou maior e exibe o resultado.

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

Exemplo 2: Declaração if-else if-else

Para verificar múltiplas condições, use else if para adicionar ramificações.

 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

Exemplo 3: Declaração if com verificação de tipos

Também é possível realizar desvios condicionais para tipos específicos utilizando o recurso de verificação de tipos do TypeScript. Por exemplo, verifique o tipo de uma variável com o operador typeof e realiza o processamento apropriado.

 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"

Exemplo 4: Declarações if Aninhadas

Você também pode aninhar declarações if para verificar condições complexas.

 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

Operador ternário (operador condicional)

Sintaxe

1condition ? valueIfTrue : valueIfFalse

Se quiser escrever uma declaração if de forma mais concisa, você pode usar o operador ternário.

Exemplo

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

Neste caso, como o number é 7, Odd será exibido.

Resumo

• A declaração if é uma estrutura de controle fundamental para determinar qual processamento executar com base em condições.
• Você pode lidar com múltiplas condições usando else if.
• Ao usar typeof, você pode aproveitar os tipos do TypeScript para desvios condicionais.
• O tratamento de condições complexas é possível com declarações if aninhadas.
• Você também pode usar o operador ternário para escrever ramificações condicionais de forma concisa.

No TypeScript, usar declarações if com atenção à segurança de tipos pode melhorar a confiabilidade do código.

Declarações Switch no TypeScript

A declaração switch no TypeScript é uma estrutura de controle usada para ramificar o código com base em múltiplas condições. Em vez de usar declarações if-else if para avaliar múltiplas condições, você pode usar uma declaração switch para escrever de forma concisa uma lógica de ramificação baseada em valores específicos.

Sintaxe Básica

 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}

Em uma declaração switch, se o valor especificado em um case corresponder à expressão avaliada, o bloco case será executado. Tenha cuidado, pois se não houver break, o próximo bloco case será executado consecutivamente. O bloco default é executado se nenhuma das instruções case corresponder.

Exemplo 1: Declaração básica switch

No exemplo abaixo, é fornecido um número representando um dia da semana (0 a 6), e o nome correspondente do dia é exibido com base nesse valor.

 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

Exemplo 2: Exemplo usando default

default é útil porque é executado quando nenhuma das instruções case corresponder, permitindo lidar com valores inesperados.

 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

Exemplo 3: Executando o mesmo processo para múltiplos cases

Se você deseja executar a mesma ação para várias instruções case, pode listá-las consecutivamente.

 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

Exemplo 4: Comportamento quando o break é omitido

Omitir um break resulta em um comportamento de "queda" onde o próximo case também é executado.

 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

Dessa forma, após um case corresponder, o próximo case também é executado, então um break geralmente é usado para evitar quedas desnecessárias.

Resumo

• A declaração switch é uma estrutura de controle que permite escrever uma lógica de ramificação baseada em várias condições de maneira concisa.
• Cada case deve encerrar explicitamente o processo usando break.
• O bloco default é executado se nenhum dos cases corresponder.
• Também é possível realizar a mesma operação para múltiplos cases.

A declaração switch em TypeScript é útil para lidar eficientemente com múltiplas condições enquanto mantém a legibilidade do código.

Você pode acompanhar o artigo acima usando o Visual Studio Code em nosso canal do YouTube. Por favor, confira também o canal do YouTube.

YouTube Video