Los enums de Ty­pe­S­cri­pt son una clase especial de variables co­n­s­ta­n­tes. Puedes definir los valores de estas variables por ade­la­n­ta­do, di­fe­re­n­cia­n­do entre enums numéricos y enums basados en cadenas.

¿Qué son los enums en Ty­pe­S­cri­pt?

Los enums (abre­via­tu­ra de “enu­me­ra­ted types”, es decir, “tipos enu­me­ra­dos”) son tipos de datos que contienen un conjunto finito de valores. Este conjunto de valores se define cla­ra­me­n­te durante la de­cla­ra­ción del enum con un ide­n­ti­fi­ca­dor y no se puede modificar po­s­te­rio­r­me­n­te. Además, puedes definir el orden en el que aparecen los valores. Con los enums de Ty­pe­S­cri­pt, puedes crear variables co­n­s­ta­n­tes que mejoran la le­gi­bi­li­dad de tu código y, al mismo tiempo, previenen errores. Los enums son una de las pocas ca­ra­c­te­rí­s­ti­cas que no son una extensión del tipado estático de Ja­va­S­cri­pt. Existen dos tipos de enums en Ty­pe­S­cri­pt: los numéricos y los basados en cadenas de texto. A co­n­ti­nua­ción, te mostramos ambas variantes.

Enums numéricos en Ty­pe­S­cri­pt

En los enums numéricos de Ty­pe­S­cri­pt, el primer valor es “0” de forma pre­de­te­r­mi­na­da. Po­s­te­rio­r­me­n­te, cada valor se in­cre­me­n­ta en “1” unidad respecto al anterior. Para crear un enum numérico, debes utilizar el parámetro enum y almacenar las cadenas en formato numérico. En el siguiente ejemplo sencillo, verás cómo definir los meses y asi­g­nar­les un valor. Luego, puedes consultar el valor asignado al mes de abril:

enum Meses {
	Enero,
	Febrero,
	Marzo,
	Abril,
	Mayo,
	Junio,
	Julio,
	Agosto,
	Septiembre,
	Octubre,
	Noviembre,
	Diciembre
}
let mesActual = Meses.Abril;
console.log(mesActual);
ty­pe­s­cri­pt

El resultado es el siguiente:

3
ty­pe­s­cri­pt

De forma pre­de­te­r­mi­na­da, el sistema asigna valores empezando por el “0”, por lo que enero recibe el valor “0”, febrero el “1”, marzo el “2” y abril el “3”. Si deseas que la nu­me­ra­ción coincida con la nu­me­ra­ción real de los meses, puedes ini­cia­li­zar los enums de Ty­pe­S­cri­pt y asignar ma­nua­l­me­n­te los valores correctos. Para ello, solo necesitas modificar li­ge­ra­me­n­te el código anterior:

enum Meses {
	Enero = 1,
	Febrero,
	Marzo,
	Abril,
	Mayo,
	Junio,
	Julio,
	Agosto,
	Septiembre,
	Octubre,
	Noviembre,
	Diciembre
}
let mesActual = Meses.Abril;
console.log(mesActual);
ty­pe­s­cri­pt

El resultado ahora coincide con la nu­me­ra­ción real de los meses:

4
ty­pe­s­cri­pt

Basta con asignar el valor que quieras al primer mes; el sistema co­n­ti­nua­rá numerando de forma as­ce­n­de­n­te en in­cre­me­n­tos de uno, como de costumbre.

Asi­g­na­ción manual de valores numéricos

Si no quieres que los valores se numeren au­to­má­ti­ca­me­n­te, también puedes asignar ma­nua­l­me­n­te un valor numérico a cada elemento del enum de Ty­pe­S­cri­pt. Por ejemplo, si tienes cuatro tomos de una serie de novelas, puedes almacenar el número de páginas de cada tomo como un valor constante. Luego, puedes comprobar el número de páginas del segundo tomo con el siguiente código:

enum NumeroDePaginas {
	Tomo1 = 491,
	Tomo2 = 406,
	Tomo3 = 360,
	Tomo4 = 301
}
let paginas = NumeroDePaginas.Tomo2;
console.log(paginas);
ty­pe­s­cri­pt

El resultado es el siguiente:

406
ty­pe­s­cri­pt

Ty­pe­S­cri­pt Enums basados en cadenas de texto

Los enums basados en cadenas de texto en Ty­pe­S­cri­pt funcionan de manera similar a los numéricos, pero en este caso, asignas cadenas de texto a los elementos del enum. Por ejemplo, puedes asignar a los días de la semana una abre­via­tu­ra adecuada en formato de cadena, que se coloca entre comillas. Luego, puedes consultar los valores de “Viernes” y “Martes” para ve­ri­fi­car­los:

enum DiasDeLaSemana {
Lunes = "Lu",
Martes = "Ma",
Miércoles = "Mi",
Jueves = "Ju",
Viernes = "Vi",
Sábado = "Sa",
Domingo = "Do"
};
console.log(DiasDeLaSemana.Viernes);
console.log(DiasDeLaSemana.Martes);
ty­pe­s­cri­pt

El resultado es el siguiente:

Vi
Ma
ty­pe­s­cri­pt

Combinar números y cadenas

En teoría, puedes combinar los enums numéricos y los basados en cadenas de Ty­pe­S­cri­pt. Aunque los casos de uso de esta opción son bastante limitados, aquí tienes un ejemplo de cómo hacerlo. En este caso, es­pe­ci­fi­ca­mos valores di­fe­re­n­tes, pero el pro­ce­di­mie­n­to es el mismo:

enum DiasDeLaSemana {
Lunes = "Lu",
Martes = 2,
Miércoles = 3,
Jueves = "Ju",
Viernes = "Vi",
Sábado = 6,
Domingo = "Do"
};
console.log(DiasDeLaSemana.Viernes);
console.log(DiasDeLaSemana.Martes);
ty­pe­s­cri­pt

Ahora el resultado es el siguiente:

Vi
2
ty­pe­s­cri­pt

Reverse Mapping en enums de Ty­pe­S­cri­pt

El Reverse Mapping (en español, “mapeo inverso”) de Ty­pe­S­cri­pt permite acceder tanto al valor de un enum como a su nombre. Para ilustrar este principio, volvamos a nuestro ejemplo con los días de la semana:

enum DiasDeLaSemana {
Lunes = 1,
Martes,
Miércoles,
Jueves,
Viernes,
Sábado,
Domingo
};
DiasDeLaSemana.Viernes
DiasDeLaSemana["Viernes"];
DiasDeLaSemana[5];
ty­pe­s­cri­pt

En este ejemplo, DiasDeLaSemana.Viernes devuelve el valor “5”. Lo mismo ocurre con DiasDeLaSemana["Viernes"]. Sin embargo, uti­li­za­n­do Reverse Mapping, DiasDeLaSemana[5] devolverá el día “Viernes”. Puedes vi­sua­li­zar esto con el siguiente código:

enum DiasDeLaSemana {
Lunes = 1,
Martes,
Miércoles,
Jueves,
Viernes,
Sábado,
Domingo
};
console.log(DiasDeLaSemana);
ty­pe­s­cri­pt

El resultado es el siguiente:

{
    '1': 'Lunes',
    '2': 'Martes',
    '3': 'Miércoles',
    '4': 'Jueves',
    '5': 'Viernes',
    '6': 'Sábado',
    '7': 'Domingo',
    Lunes: 1,
    Martes: 2,
    Miércoles: 3,
    Jueves: 4,
    Viernes: 5,
    Sábado: 6,
    Domingo: 7
}
ty­pe­s­cri­pt

Convertir Ty­pe­S­cri­pt Enums en arrays

También puedes convertir enums de Ty­pe­S­cri­pt en arrays de Ty­pe­S­cri­pt. Por ejemplo, para convertir los días de la semana en un array, puedes utilizar el siguiente código:

enum DiasDeLaSemana {
Lunes = "Lu",
Martes = "Ma",
Miércoles = "Mi",
Jueves = "Ju",
Viernes = "Vi",
Sábado = "Sa",
Domingo = "Do"
};
const diasDeLaSemanaArray: { label: string; value: string }[] = [];
for (const key in DiasDeLaSemana) {
    if (DiasDeLaSemana. hasOwnProperty(key)) {
        diasDeLaSemanaArray.push({ label: key, value: DiasDeLaSemana[key] });
    }
}
console.log(diasDeLaSemanaArray);
ty­pe­s­cri­pt

El resultado es el siguiente:

[
    { label: 'Lunes', value: 'Lu' },
    { label: 'Martes', value: 'Ma' },
    { label: 'Miércoles', value: 'Mi' },
    { label: 'Jueves', value: 'Ju' },
    { label: 'Viernes', value: 'Vi' },
    { label: 'Sábado', value: 'Sa' },
    { label: 'Domingo', value: 'Do' }
]
ty­pe­s­cri­pt
Consejo

Despliega tu página web estática o apli­ca­ción di­re­c­ta­me­n­te a través de GitHub: con Deploy Now de IONOS, te be­ne­fi­cias de una co­n­fi­gu­ra­ción rápida, flujos de trabajo op­ti­mi­za­dos y varias tarifas. ¡Encuentra la solución que mejor se adapte a tu proyecto!

Ir al menú principal