Melhores Práticas para Lógica Condicional no TypeScript

Este artigo explica as melhores práticas para lógica condicional no TypeScript.

YouTube Video

Melhores Práticas para Lógica Condicional no TypeScript

Restringindo Tipos com Guardas de Tipo

Aproveitando o sistema de tipos do TypeScript e utilizando guardas de tipo em declarações if, você pode melhorar a segurança dos tipos e a legibilidade.

1function processInput(input: string | number) {
2    if (typeof input === "string") {
3        console.log(`String input: ${input.toUpperCase()}`);
4    } else {
5        console.log(`Number input: ${input.toFixed(2)}`);
6    }
7}

Usar typeof e outros guardas de tipo garante que o código dentro de cada bloco seja seguro em termos de tipos e contextualmente relevante.

Evite Declarações if Aninhadas

Declarações if profundamente aninhadas reduzem a legibilidade e a manutenibilidade do código. Ao invés disso, use retornos antecipados, operadores lógicos ou extraia funções.

Exemplo Ruim:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (user.age) {
3        if (user.age > 18) {
4            if (user.isAdmin) {
5                console.log("User is an adult admin.");
6            }
7        }
8    }
9}

Exemplo Melhorado:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (!user.age || user.age <= 18 || !user.isAdmin) {
3        return;
4    }
5    console.log("User is an adult admin.");
6}

Essa abordagem simplifica o código e torna a lógica mais compreensível.

Utilize Encadeamento Opcional

Ao verificar propriedades aninhadas, utilize o encadeamento opcional (?.) para evitar condições if desnecessárias.

Sem Encadeamento Opcional:

1if (user && user.profile && user.profile.email) {
2    console.log(user.profile.email);
3}

Usando Encadeamento Opcional:

1if (user?.profile?.email) {
2    console.log(user.profile.email);
3}

Isso reduz o código repetitivo e melhora a legibilidade. Aqui, código repetitivo refere-se a código padronizado e repetitivo que é frequentemente necessário para realizar tarefas específicas na programação.

Use Operadores de Igualdade Estrita

O TypeScript suporta tipagem estrita, e o uso de igualdade estrita (===) ou desigualdade estrita (!==) ajuda a prevenir coerções de tipo inesperadas.

Exemplo Ruim:

1if (value == "123") {
2    console.log("Value is 123.");
3}

Exemplo Melhorado:

1if (value === "123") {
2    console.log("Value is 123.");
3}

Use Enums ou Tipos Literais para Condições Explícitas

Usar enums ou tipos literais esclarece condições e reduz as chances de erros.

 1type Status = "success" | "error" | "loading";
 2
 3function displayMessage(status: Status) {
 4    if (status === "success") {
 5        console.log("Operation succeeded.");
 6    } else if (status === "error") {
 7        console.log("Operation failed.");
 8    } else {
 9        console.log("Loading...");
10    }
11}

Ao definir valores esperados, o TypeScript pode detectar tipos e garantir a precisão.

Combine condições similares

Quando várias condições compartilham a mesma lógica, consolide-as usando operadores lógicos ou uma instrução switch.

Exemplo Ruim:

1if (role === "admin") {
2    grantAccess();
3}
4if (role === "superadmin") {
5    grantAccess();
6}

Exemplo Melhorado:

1if (role === "admin" || role === "superadmin") {
2    grantAccess();
3}

Alternativamente, use uma instrução switch para lidar com vários caminhos claros:

 1switch (role) {
 2    case "admin":
 3    case "superadmin":
 4        grantAccess();
 5        break;
 6    case "user":
 7        console.log("Limited access.");
 8        break;
 9    default:
10        console.log("No access.");
11}

Evite tornar as expressões condicionais complexas

Expressões condicionais complexas em instruções if reduzem a legibilidade. Extraia-as para variáveis ou funções significativas.

Exemplo Ruim:

1if (user.age > 18 && user.isAdmin && user.permissions.includes("write")) {
2    console.log("User can write.");
3}

Exemplo Melhorado:

1const isAdultAdminWithWriteAccess = user.age > 18 && user.isAdmin && user.permissions.includes("write");
2if (isAdultAdminWithWriteAccess) {
3    console.log("User can write.");
4}

Dar nomes às condições melhora a clareza e torna o código autoexplicativo.

Use operadores ternários para condições simples

Para condições simples, o uso de operadores ternários torna o código mais conciso.

Exemplo:

1const message = isLoggedIn ? "Welcome back!" : "Please log in.";
2console.log(message);

No entanto, evite usar operadores ternários para condições complexas, pois isso reduz a legibilidade.

Conclusão

Seguindo estas boas práticas, você pode tornar as instruções if no TypeScript claras, eficientes e fáceis de manter. Aproveite os recursos do TypeScript, como type guards, optional chaining e enums, para melhorar a legibilidade e a robustez do seu código. Mantenha as condições concisas e claras, buscando um código que seja sempre fácil de entender e manter.

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