A煤n no tienes acceso a esta clase

Crea una cuenta y contin煤a viendo este curso

Enum

16/32
Recursos

Aportes 36

Preguntas 4

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

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

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

// 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

Para unir o extender un enum de otro es de la siguiente manera.

enum FirstEnum {
    value1 = 'value1',
    value2 = 'value2'
}

enum SecondEnum {
    value3 = 'value3',
    value4 = 'value4'
}

let testEnum = Object.assign({}, FirstEnum, SecondEnum);

console.log(testEnum.value4) // value 4

As铆 testEnum tiene los valores de los dos anteriores Enum ya que en runtime se pueden combinar estos dos objetos. En Javascript se traducir铆a de la siguiente forma.

"use strict";
var FirstEnum;
(function (FirstEnum) {
    FirstEnum["value1"] = "value1";
    FirstEnum["value2"] = "value2";
})(FirstEnum || (FirstEnum = {}));
var SecondEnum;
(function (SecondEnum) {
    SecondEnum["value3"] = "value3";
    SecondEnum["value4"] = "value4";
})(SecondEnum || (SecondEnum = {}));
let testEnum = Object.assign({}, FirstEnum, SecondEnum);
console.log(testEnum.value4); // value 4
  • Los enumerados permiten definir un conjunto de constantes con nombre
  • Tienen la ventaja de adapartse al contexto de la aplicaci贸n

Documentaci贸n oficial de enums en TS

//* Orientaci贸n para fotograf铆as
/* const landscape = 0
const portrait = 1
const square = 2
const panorama = 3 */

//*Una forma m谩s inteligente de declarar constantes
enum PhotoOrientation {
  Landscape = 'cero', //* Podemos asignar un valor en particular
  Portrait = 1, //* 1
  Square = 2, //* 2
  Panorama = 3 //* 3
}

const landscape: PhotoOrientation = PhotoOrientation.Landscape
const square: PhotoOrientation = PhotoOrientation.Square

console.log('landscape: ', landscape) //* Accede al valor
console.log('Square: ', PhotoOrientation[square]) //* Accede al nombre

//*Siempre tenemos valores consecutivos que incrementan de 1 en 1
enum PictureOrientation {
  Landscape = 10,
  Portrait, //* 11
  Square, //* 12
  Panorama,// *13
}

console.log('Portrait: ', PictureOrientation.Portrait) //* valor 11

//* Es la misma l贸gica que: { key, value }
enum Country {
  Bolivia = 'BOL',
  Colombia = 'COL',
  Mexico = 'MEX',
  EEUU = 'USA',
  Espana = 'ESP'
}

const mexico:Country = Country.Mexico
console.log('M茅xico: ', mexico)

//! Country.Mexico = 'MX' //!Esto da un error, no podemos modificar su valor

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

en la practica es como un objeto clave-valor.

Los Enum nos ayudan a escribir un c贸digo m谩s legible.

Pr谩cticamente esto es un Objeto que tiene como key los textos que declaramos y los indices que se autodefinen o definimos , ya que la salida de todo eso es

{
    0: "Landscape",
    1: "Portrair",
    2: "Square",
    3: "Panorama",
    Landscape: 0,
    Panorama: 3,
    Portrair: 1,
    Square: 2,
}

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 鈥渃ustom鈥 el primer enumerado los demas se 鈥渆numeran鈥 a partir de ese valor que se le asigna

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(鈥楲andscape鈥,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:

鈥淪yntaxError: 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:

https://stackoverflow.com/questions/63635409/syntaxerror-unexpected-reserved-word-on-typescript

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;

Enum

  • 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]);

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

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 馃檹馃徏

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)

Se escribe demasiado.

Object.assign({}, firstEnum, secondEnum)

enum pictureOrientation {
    Landscape = 10,
    Portrait,
}

enum pictureOrientation {
    Square = 20,
    Panorama,
}

console.log("Square", pictureOrientation.Square)
console.log("pictureOrientation", pictureOrientation)

Estuve jugando un poco e hice esto:

enum ColoresPrimarios {
  Red = 'Red',
  Green = 'Green',
  Blue = 'Blue'
}

enum CombinacionColores {
  Black = 0,
  Brown = ColoresPrimarios.Red + ColoresPrimarios.Green,
  Yellow = ColoresPrimarios.Green + ColoresPrimarios.Blue,
  Purple = ColoresPrimarios.Red + ColoresPrimarios.Blue,
  White = ColoresPrimarios.Red + ColoresPrimarios.Green + ColoresPrimarios.Blue,
}

console.log('Colores Primarios: ', ColoresPrimarios)
console.log('Combinaci贸n de Colores: ', CombinacionColores)
console.log('Red: ', ColoresPrimarios.Red)
console.log('Green: ', ColoresPrimarios.Green)
console.log('Blue: ', ColoresPrimarios.Blue)
console.log('Brown: ', CombinacionColores.Brown)
console.log('Yellow: ', CombinacionColores.Yellow)
console.log('Purple: ', CombinacionColores.Purple)
console.log('White: ', CombinacionColores.White)

resultado:
Colores Primarios: { Red: 鈥楻ed鈥, Green: 鈥楪reen鈥, Blue: 鈥楤lue鈥 }
Combinaci贸n de Colores: {
鈥0鈥: 鈥楤lack鈥,
Black: 0,
Brown: 鈥楻edGreen鈥,
Yellow: 鈥楪reenBlue鈥,
Purple: 鈥楻edBlue鈥,
White: 鈥楻edGreenBlue鈥
}
Red: Red
Green: Green
Blue: Blue
Brown: RedGreen
Yellow: GreenBlue
Purple: RedBlue
White: RedGreenBlue

Si ponemos n煤meros, los va a sumar, si ponemos strings, los va a concatenar

驴podr铆a ayudar el uso de uniones?

enum State 
{
    State1,
    State2
}

enum AnotherState
{
     State1,
     State2,
     State3,
     State4
}

const x: State | AnotherState = State.State1;

const y: State | AnotherState = AnotherState.State3;```

Los enum se podria decir que son una lista de valores. Las variables que tengan definido como tipo un enum solo podran asignarsele valores que esten dentro del enum.

Enum: Permiten definir un conjunto de constantes con nombre.
Tienen la ventaja de adaptarse al contexto de la aplicacion.

// crear
enum PhotoOrientation {
	Landscape,
	Portrait,
	Square,
	Panorama
}
// utilizar
const landscape: PhotoOrientation = PhotoOrientation.Landscape

En el fondo son arreglo, por lo que pueden accederse v铆a indices.
Podemos definir tambien los valores para las claves.

enum Country{
	Bolivia = 'bol'
	Colombia = 'col'
}

Un caso de uso para los enums es utilizarlos como bandares, esto nos permitira utilizarlo para validar algun posible conjunto de condicionales en nuestro desarrollo.
.
Fuente: Enums - TypeScript Deep Dive

console.clear();

// Orientacion para Fotografias

const landscape = 0;
const portrait = 1;
const square = 2;
const panorama = 3;

enum PhotoOrientation {
  Landscape,
  Portrait,
  Square,
  Panorama,
}

enum FelType {
    Invoice = 'Invoice',
    SpecialInvoice = 'SpecialInvoice'
}

const photo: PhotoOrientation = PhotoOrientation.Landscape;
console.log('photo:',photo);

let invoice : FelType;
invoice = FelType.SpecialInvoice;

console.log('invoice type:',invoice);

As铆 lo har铆a yo:

enum PaisesAmerica {
	Colombia = 'COL',
	Mexico = 'MXN',
	Argentina = 'ARG',
}

enum Europa {
	Espa帽a = 'ESP',
	Alemania = 'ALM',
	Italia = 'ITA',
}

const Fusion = {
    ...PaisesAmerica,
    ...Europa
}

console.log(Fusion);
// Los enumerados permiten definir un conjunto de constantes con nombres reconocibles
// Orientacion para Fotograf铆as
// const landscape = 0;
// const portrait = 1;
// const square = 2;
// const panomara = 3;

enum PhotoOrientation {
    Landscape = 0, // 0   // asignaci贸n expl铆cita
    Portrait = 1, // 1
    Square = 2, // 2
    Panorama = 3 // 3
}

const landscape: PhotoOrientation = PhotoOrientation.Landscape;
console.log('Landscape', landscape);
console.log('Landscape', PhotoOrientation[landscape]);

enum PictureOrientation {
    Landscape = 10, // 10   //inicializar la asignaci贸n
    Portrait, // 11
    Square, // 12
    Panorama // 13
}
console.log('Portrait: ', PictureOrientation.Portrait);
console.log('Panorama: ', PictureOrientation.Panorama);

enum Country {
    Bolivia = 'bol',
    Colombia = 'col',
    Mexico = 'mex',
    EEUU = 'usa',
    Espa帽a = 'esp'
}

const country: Country = Country.Espa帽a;
console.log('Country: ', country);```

Genial

enum Country {
  Bolivia = 'bol',
  Colombia = 'col',
  Mexico = 'mex',
  EEUU = 'usa',
  Espa帽a = 'esp'
}

enum CountryExtended {
  Argentina= 'Arg',
  Brasil= 'Bra'
}

// Based in es6, you have to config that value in the tsconfig.json

let joinedEnums = Object.assign({}, Country, CountryExtended);
console.log('Joined Enums', joinedEnums);

// Sprinte operator

let joinedEnumsSprite = { ...Country, ...CountryExtended };
console.log('Joined Enums Sprite', joinedEnumsSprite);

.

MY NOTES ENUM

  • Los enumeraos permiten definir un conjunto de constantes con nombre
  • Tiene la ventaja de adaptarse al contexto de la aplicaci贸n
//Enum
  //Orientacion de fotografias

//const Landscape = 0;
//const portrait = 1;
//const square = 2;
//const panorama = 3;

//En typescript podremos definir estos valores como si fueran un nuevo tipo

enum PhotoOrientation{
  Landscape = 0, //0
  Portrait = 1, //1
  Square = 2, //2
  Panorama = 3, //3

}

const landscape: PhotoOrientation = PhotoOrientation.Landscape;
console.log(landscape);
console.log(PhotoOrientation[0]); //accedemos al atributo del objeto
console.log(PhotoOrientation[landscape]); //podremos acceder incluso con la misma variable

//si inicializaramos el primer valor con 10 los siguientes aumentarian en 1
  //Siempre son valores consecutivos y que se van incrementando de uno en uno
enum PictureOrientation{
  Landscape = 10, //10
  Portrait,  //11
  Square,  //12
  Panorama //13

}

console.log('portrait', PictureOrientation.Portrait); //11

//Existe otra forma de personalizar los enum en typescript

enum Country{
  Bolivia = "BOL",
  Colombia = "COL",
  Mexico = "MEX",
  EEUU = "usa",
  Espana = "esp"

}

const country:Country = Country.Colombia;
console.log('country', country);

Para tener en cuenta:

.

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 LANDSCAPE (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.LANDSCAPE la consulta retornara la asignaci贸n o valor de una constante con el nombre de LANDSCAPE y que sin asignaci贸n por defecto seria 0.

  • Enum : Una enumeraci贸n es la forma de organizar una colecci贸n de datos relacionados entre s铆.
enum Movement {	
    UP = 1,	
    DOWN = 2,	
    LEFT = 3, 	
    RIGHT = 4,	
}

const sendMovement = function( movement: number ) {	
    console.log(movement);
}	
sendMovement(Movement.UP);
sendMovement(Movement.RIGHT);
sendMovement(Movement.DOWN);
sendMovement(Movement.LEFT);

Se podria emplear con paleta de colores y sus hexadecimal