Enums TypeScript é uma frase que encontrará muito ao lidar com a linguagem TypeScript.
TypeScript está entre os mais jovens, mas também é classificado como uma das linguagens de programação mais populares entre os desenvolvedores. TypeScript é uma extensão (superconjunto) de JavaScript. Assim, qualquer código JavaScript válido também é válido em TypeScript. No entanto, o TypeScript introduz recursos de digitação estática (um recurso ausente no JavaScript).
O que são Enums TypeScript, seus casos de uso e como você pode criá-los? Este artigo cobrirá tudo o que você precisa saber sobre Enums.
últimas postagens
O que são enums TypeScript?
Enums (tipos enumerados) são estruturas de dados de comprimento constante que contêm um conjunto de valores imutáveis (constantes). TypeScript não é a única linguagem que usa Enums, pois eles estão disponíveis em linguagens orientadas a objetos como C# e Java.
No TypeScript, enums permitem que os desenvolvedores criem um conjunto de casos distintos ou intenções de documento. Eles também são importantes na definição de valores ou propriedades que só podem ter um determinado número de valores. Por exemplo, só pode haver sete continentes no mundo.
Em resumo, as enums TypeScript são importantes das seguintes maneiras;
- Eles são flexíveis, pois permitem que os desenvolvedores documentem e expressem intenções e casos de uso facilmente
- Enums permitem que os desenvolvedores criem constantes personalizadas com eficiência energética em JavaScript
- Economiza compilação e tempo de execução ao compilar código TypeScript em código JavaScript
Enums TypeScript podem ser strings ou em formato numérico. No entanto, essas enumerações são pré-processadas e não passam por testes durante a fase de teste. TypeScript traduz/converte enums em código JavaScript.
Enums diferentes em TypeScript
Agora que você entende os Enums, é hora de vê-los funcionar no TypeScript. Você pode configurar um servidor de desenvolvimento baixando TypeScript e Node.js em sua máquina local ou usando soluções online. Usaremos o Parque TypeScript para demonstrar diferentes enums TypeScript.
Estes são os diferentes tipos de Enum no TypeScript;
#1. Enums numéricos
Você precisa usar a palavra-chave ‘enum’ e segui-la com o nome do enum que deseja criar. Depois disso, você cria colchetes que especificarão os membros do enum. Este é um exemplo de enum numérico;
enum CardinalDirections {
North = 5,
East,
South,
West,
};
O acima representa um enum chamado CardinalDirections que possui quatro membros. Nesse caso, só pode haver quatro valores (Norte, Leste, Sul e Oeste), tornando enum uma excelente opção para armazenar dados.
Atribuí o valor 5 a CardinalDirections.North. No entanto, não atribuí os outros valores porque o TypeScript fará o resto automaticamente. Por exemplo, o valor para CardinalDirections.East será 6, pois o TypeScript incrementa o valor anterior em 1.
O CardinalDirections.West será 8.
E se não atribuirmos um valor ao primeiro item entre colchetes? Nosso enum será;
enum CardinalDirections {
North,
East,
South,
West,
};
O TypeScript atribuirá automaticamente o valor Norte 0. Se você digitar algo como CardinalDirections.West, obterá 3
#2. Enumerações de string
Cada membro em uma string enum deve ser inicializado com outro membro da string enum ou uma string literal. Este é um exemplo de enum de string;
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}
Esta enumeração não aumenta como acontece nas enumerações numéricas. Se você executar este código;
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}
console.log(Direction.Right)
Isto é o que você recebe;
“CERTO”
#3. Enums heterogêneos
Você pode misturar membros numéricos e de string para formar uma enumeração heterogênea. Isto é um exemplo;
enum HeterogeneousEnum {
No = 0,
Yes = "YES",
}
#4. Membros enum constantes e computados
Os membros do Enum possuem valores associados a eles, que podem ser ‘constantes’ ou ‘computados’.
Este é um exemplo de enum constante;
enum E1 {
X,
Y,
Z,
}
Nesse caso, o primeiro membro do enum não possui um inicializador e o TypeScript atribui a ele o valor 0.
Você também pode considerar este exemplo;
enum E1 {
X=1,
Y,
Z,
}
Esta também é uma enumeração constante, pois ao primeiro membro é atribuído um valor e a regra incremental é aplicada ao restante.
Enums computados misturam membros constantes e computados. Confira este exemplo;
enum Color {
Red = 100,
Green = (Math.random() * 100),
Blue = 200
}
O membro Enum ‘Blue’ é um membro constante. Por outro lado, o membro enum ‘Green’ é um enum calculado com a função Math.random() em tempo de execução.
#5. Enumerações constantes
enums const são usados para aumentar o desempenho de enums numéricos. Neste caso, declaramos o enum como const.
Considere este código que mostra os dias da semana;
enum Weekday {
Monday = 1,
Tuesday,
Wednesday,
Thursday,
Friday
}
Se executarmos console.log(Weekday.Thursday), obteremos nossa resposta como 4. No entanto, se verificarmos o JavaScript gerado em tempo de compilação, obteremos isto;
"use strict";
var Weekday;
(function (Weekday) {
Weekday[Weekday["Monday"] = 1] = "Monday";
Weekday[Weekday["Tuesday"] = 2] = "Tuesday";
Weekday[Weekday["Wednesday"] = 3] = "Wednesday";
Weekday[Weekday["Thursday"] = 4] = "Thursday";
Weekday[Weekday["Friday"] = 5] = "Friday";
})(Weekday || (Weekday = {}));
console.log(Weekday.Thursday);
Podemos alterar este código e declarar ‘Weekday’ como uma constante;
const enum Weekday {
Monday = 1,
Tuesday,
Wednesday,
Thursday,
Friday
}
Se executarmos este código console.log(Weekday.Thursday), o JavaScript que será gerado em tempo de compilação será;
"use strict"; console.log(4 /* Weekday.Thursday */);
Você pode ver que o código JavaScript em tempo de compilação é otimizado quando você declara seu enum como const.
#6. Enums ambientais
Enums ambientais usam a palavra-chave ‘declare’ para descrever a forma dos tipos de enum já existentes. Considere este exemplo;
declare enum Color {
Red,
Green,
Blue
}
Enums ambientais são declarados fora de qualquer módulo e podem ser usados para criar tipos reutilizáveis. Dessa forma, você sempre pode importar enumerações de ambiente e usá-las em seus componentes, desde que sejam declaradas globalmente.
Agora você entende os diferentes tipos de enum no TypeScript. Agora podemos mostrar como você pode usar enums de diferentes maneiras. Este será o nosso código de referência;
enum Direction {
North="N",
East="E",
South="S",
West="W",
};
Estes são alguns casos de uso;
- Extraia membros enum. Por exemplo, se quisermos acessar o Norte, podemos usar
console.log(Direção.Norte); //Saídas: ‘N’
- Use membros enum: você pode escolher um determinado membro enum para representar uma direção específica. Por exemplo,
const currentDirection = Direction.East;
console.log(`The current direction is ${currentDirection}`);
Isso fornecerá esta saída “A direção da corrente é E”
Enums vs. mapas de objetos em TypeScript
Enums são usados para representar um conjunto finito de valores. Por exemplo, as cores do arco-íris ou os dias da semana. Enums são fortemente tipados, o que significa que capturam quaisquer erros durante o desenvolvimento. Este é um exemplo de enumeração TypeScript;
enum Color {
Red,
Green,
Blue,
}
Mapas de objetos/dicionários/pares de valores-chave armazenam e recuperam valores associados a chaves específicas. Você pode usar mapas de objetos TypeScript para armazenar qualquer tipo de dados. No entanto, eles não são estritamente digitados, o que significa que erros de tipo podem não ser capturados durante o desenvolvimento. Este é um exemplo de Mapa de Objetos das mesmas cores;
const colors = {
red: "FF0000",
green: "00FF00",
blue: "0000FF",
};
As principais diferenças entre enums e mapas de objetos no TypeScript são;
- Enums são estritamente digitados, enquanto mapas de objetos não são
- Enums são um ‘Tipo’, enquanto mapas de objetos são uma estrutura de dados
- Enums não são flexíveis, enquanto mapas de objetos são flexíveis
Melhores práticas de uso de enums em TypeScript
Já afirmamos que TypeScript não é a única linguagem de programação com o recurso enums. Seguir as práticas recomendadas garante que você escreva um código limpo, otimizado e sem erros. Estas são algumas das melhores práticas ao escrever/usar enums TypeScript;
- Colocar nomes de enum em maiúscula: Sempre coloque a primeira palavra em maiúscula ao nomear uma enumeração. Por exemplo, é sempre aconselhável ter um enum ‘Número’ em vez de ‘número’.
- Use enums para constantes: Enums são melhor usados para declarar um conjunto fixo de itens relacionados. Por exemplo, só pode haver 7 dias na semana. Os membros do enum nunca devem mudar durante a execução.
- Evite o uso excessivo de enums: você pode ter acabado de aprender um novo conceito e deseja usá-lo em quase todos os lugares do seu projeto TypeScript. No entanto, sempre use enums TypeScript com moderação. Enums TypeScript são uma boa escolha quando você deseja manter a legibilidade do código.
- Considere enums como enums: você pode usar enums TypeScript para diferentes finalidades. No entanto, a melhor opção é usá-los para representar apenas enums e não outras estruturas de dados.
- Evite enumerações automáticas: o TypeScript atribui valores aos membros da enumeração se você não os atribuir explicitamente. Forneça valores às suas enumerações e evite comportamentos inesperados ao executar seu código.
- Enums de documentos: sempre documente ou comente seu código se pretende que ele seja consumido pelo público em geral. Explique o que cada enum faz e por que é o melhor caso de uso.
Você também pode explorar as principais bibliotecas TypeScript e tempo de execução para saber como desenvolvedor.
Conclusão
Você pode definir enums em TypeScript e explicar os diferentes tipos e seus casos de uso. TypeScript será útil quando você deseja clareza de código. No entanto, também existem alguns casos em que você deve evitá-los e usar objetos.
Por exemplo, você não deve usar enums ao lidar com valores dinâmicos. Você também não pode usar enums como variáveis; seu programa retornará erros.
Você pode aprender mais sobre as diferenças entre TypeScript e JavaScript se ainda estiver confuso com os dois.