Cursos Empresas Blog Live Conf Eventos Precios

0:0010:59

Enum

Clase 16 de 32

Clase 16 / 32

Alberto Camarena

Noté que cuando asignas un valor de tipo distinto a numero a los atributos de enum ya no puedes acceder a ellos con corchetes [] como lo que hizo el profesor al principio en la parte de:

enum PhotoOrientation {
	Landsacape,
	...
}
console.log(PhotoOrientation[0])

Es decir cuando trato de hacerlo con:

enum PhotoOrientation {
	Landsacape = 'Un string',
	...
}
console.log(PhotoOrientation[0]) //Marca error de tipos

Esto genera un error, alguien me podría explicar por qué es así por favor 🙏🏼

Manuel Humberto Buitrago Bonilla

Hace 6 años

Hola Alberto,

Por lo que pude entender y consultar en internet, lo que se ingresa dentro de los [ ] no son índices, sino los valores de las constantes dentro del enum y solo aplica para tipos numéricos. En el caso de PhotoOrientation, si no le asignas un valor a la LANDSACAPE (que por cierto la constante se ha de escribir en mayúscula) esta por defecto adquiere el valor de 0 y las demás constantes se incrementan en 1. Así, si la primera constante la inicias en 7, las siguientes adquieren el valor de 8, 9, 10, etc.

Entonces, al invocar PhotoOrientation[0] lo que estas haciendo es consultar dentro del enum una constante cuya asignación o valor sea 0 y esta consulta retornara el nombre de la constante.

Igualmente al invocar PhotoOrientation.LANDSACAPE la consulta retornara la asignación o valor de una constante con este nombre y que en este caso seria 0.

Alberto Camarena

Hace 6 años

Muchas gracias por la aclaración mecato :D

Comentarios (41)41 comentarios

Javi Felices

Buscando algún ejemplo más sobre unir o extender en enum, he encontrado esta:

enum DiasLaborales {
  Lunes = 'MON',
  Martes = 'TUE',
  Miercoles = 'WED',
  Jueves = 'THU',
  Viernes = 'FRI'
}

enum DiasFinSemana {
  Sabado = 'SAT',
  Domingo = 'SUN'
}

const Semana = {
  ...DiasLaborales,
  ...DiasFinSemana
}

console.log(Semana.Lunes); // MON
console.log(Semana.Sabado); // SAT

Cristian Blandon

Ojo que ahí no se están extendiendo los enums en un nuevo enum... Simplemente se está creando un objeto con los pares key-value de los 2 enums.

Pablo Verduzco

La manera de extender un enum en TypeScript es simplemente asignando nuevos valores al enum que queremos extender, es decir:

enum Color {
    Red,
    Green,
    Blue
}

enum Color {
    DarkRed = 3,
    DarkGreen,
    DarkBlue
}

Tomando en cuenta que es necesario reinicializar el primer elemento del segundo enum en continuación del primero. . Esto se puede lograr ya que una vez compilado nuestro código a JavaScript un enum no deja de ser un objeto literal, es por eso que se pueden asignar nuevos valores. . Fuente: Enums are open ended - TypeScript Deep Dive Number Enums and Strings - TypeScript Deep Dive

Moisés Manuel Morín Hevia

Hace 5 años

A muy bien, gracias.

Luis Angel

La respuesta realmente correcta es esta, muchas gracias!

Boris Vargas Paucara

// Enum: permiten definir un conjunto de constantes con nombre

// Orientacion para Fotografias
// const landscape = 0;
// const portrait = 1;
// const square = 2;
// const panorama = 3;

enum PhotoOrientation {
    Landscape = 0, // podemos darle valor de manera explicita
    Portrait,   // 1
    Square,     // 2
    Panorama    // 3
}

const landscape: PhotoOrientation = PhotoOrientation.Landscape;

console.log('landscape : ', landscape); // -> 0
console.log('Landscape : ', PhotoOrientation[0]); // -> Landscape

enum PictureOrientation {
    Landscape = 10, // 10
    Portrait,   // 11
    Square,     // 12
    Panorama    // 13
}
console.log('porttrait : ', PictureOrientation.Portrait); // -> 11

enum Country {
    Bolivia = 'bol',
    Colombia = 'col',
    Mexico = 'mex',
    EEUU = 'usa',
    España = 'esp'
}
const country: Country = Country.Colombia;
console.log('country : ', country); // --> col

David Vargas Domínguez

Isabella Susana

Para el uso de assign se debe cambiar la especificación a:

 "target": "es6"

Miguel Angel Reyes Moreno

Sixto Ortega

Una recomendacion es que los enums por lo general van en mayusculas, dado que son constantes.

Carlos Javier Bazan Huaman

en la practica es como un objeto clave-valor.

Luis Ricardo Legreaux Medina

Estoy de acuerdo he visto esa practica de manera real asignando la misma clave al valor que lleva para dejar el codigo mas legible.

Sï, un diccionario que guarda constantes.

Jimmy Buriticá Londoño

Los Enum nos ayudan a escribir un código más legible.

Jorge Méndez Ortega

Raul Hernández

Yo pensé lo mismo pero tiene varias ventajas como que puedes agregarle el tipado "Country" por ejemplo

const country: Country

entiendo lo que comentas raulmar en esencia el enum es como un objeto

Juan David González Rodríguez

Para que se usa el tipo de dato Enum o a que hace refencia , me confundi un poco con este tipo de dato?

Mauricio Galvez

Enum es un conjunto de constantes.

Ejemplo: Enum de constantes matemáticas

enum MathConst {
Pi = 3.14,
e = 2,71
}

Básicamente es un tipo de dato que se usa para agrupar constantes que tienen una relación entre si.

ooww muchas gracias jaja :D

Jesus Daniel Castro Flores

Todavía no me queda claro cuando usarlos, he leido pero no me termina de parece usable

Bramucci Candela

Supongo que son para casos donde necesitas limitar la cantidad de variables. Me explico. Imagina una app en la que pueden haber tres tipos de suscriptores: free, pro, pro+. Usarías un enum para definirlos. Si querés hacer validaciones no tenés que fijarte si escribiste las variables de forma correcta. Simplemente usas el enum.

O así me lo imagino yo, soy nueva en TS pero me pareció un caso útil.

Carlos Petit

Los enum en Typescript funcionan igual que en swift, si declaras:

enum PhotoOrientation {
    Landscape = 2,
    Portrait,
    Square,
    Pano
}

Obtienes como resultado:

{
  '2': 'Landscape',
  '3': 'Portrait',
  '4': 'Square',
  '5': 'Pano',
  Landscape: 2,
  Portrait: 3,
  Square: 4,
  Pano: 5
}

es decir, si inicializas con un valor "custom" el primer enumerado los demas se "enumeran" a partir de ese valor que se le asigna

Ricardo Arratia Joglar

en enum generalmente no sabemos los valores numéricos asociados, por lo tanto si queremos saber el nombre que representa, entonces lo haríamos así, sin saber el número asociado:

console.log('Landscape',PhotoOrientacion[PhotoOrientacion.Landscape);

Enum, conjunto de constantes con nombre. Es darle a una variable un nombre con un valor numérico. Con un índice se ve el estado del enumerado. Se pueden personalizar los índices asignandoles un valor.

Si presentas el siguiente problema:

"SyntaxError: Unexpected reserved word on typescript"

al momento de ejecutar tu archivo type-enum.js con node, instala lo siguiente:

npm i -g ts-node

y para compilar tu archivo .ts y ejecutarlo a la vez solo necesitas ejecutar el comando junto con su archivo de TypeScript:

ts-node type-enum.ts

Ello te permitirá ejecutar directamente tu archivo .ts sin tener que llamar a node de forma manual y así evitar el error que te está apareciendo.

Fuente:

David Argote

Solución al reto:

// Extends Enums

enum PrimaryColors  {
    Red = 'Red',
    Yellow = 'Yellow',
    Blue = 'Blue'
}

enum SecondaryColors {
    Orange = 'Orange',
    Green = 'Green',
    Violet = 'Violet'
}

type AllColors = PrimaryColors | SecondaryColors;

const colorRed: AllColors = PrimaryColors.Red;
const colorOrange: AllColors = SecondaryColors.Orange;

Gustavo Adolfo Perez Ramos

Los enumerados permiten definir un conjunto de constantes con nombre
Tiene la ventaja de adaptarse al contexto de la aplicación

enum PhotoOrientation {
  Landscape = "Landscape",
  Portrait = "Portrait",
  Square = "Square",
  Panorama = "Panorama",
}
const landscape: PhotoOrientation = PhotoOrientation.Landscape;

console.log(landscape);
// console.log(PhotoOrientation[landscape]);

Luis Angel Flores Galindo

Ejemplo típico de los meses:

enum Months {
  January = 'Enero',
  February = 'Febrero',
  March = 'Marzo',
  April = 'Abril',
  May = 'Mayo',
  June = 'Junio',
  July = 'Julio',
  August = 'Agosto',
  September = 'Septiembre',
  October = 'Octubre',
  November = 'Noviembre',
  December = 'Diciembre'
}

const firstMonth: Months = Months.January;
console.log('Mes:', firstMonth);
console.log('Mes:', Months.December);

Salida:

Mes: Enero
Mes: Diciembre

Julio Cesar Estrada Marcial

Algo a tener en cuenta es que si no colocas un identificador o llave para los elementos del enum se pueden duplicar cuando les hagas merge.

enum WorkDays {
    Monday = 1,
    Tuesday = 2,
    Wednesday = 3,
    Thursday = 4,
    Frida = 5,
}

enum WeekendDays {
    Saturday = 6,
    Sunday = 7,
}

const Week = {
    ...WorkDays,
    ...WeekendDays
}

console.log(Week)

Enum

Progreso del curso

Introducción a TypeScript

Entorno de Desarrollo

Tipos en TypeScript

Tipos Personalizados

Módulos

Cierre