Alias y tipos literales

La utilidad de TS me está gustando 😃

(()=>{
  /**
   * // definiendo un tipo //!alias type
   */
  type UserID =  string | number | boolean;

  let userId: string | number | boolean;

  function greeting(parametro: UserID){
    return typeof parametro === "string"
    ? console.log("myTextIs (+)>", parametro.toLocaleLowerCase()) : null;
  };

  //? Literal types
  let shirtSize: "S" | "M" | "L" | "XL";
  shirtSize = "S";    ////ok
  shirtSize = "M";    ////ok
  // shirtSize = "s"; //// wrong

  //* lo mismo
  type TSizes =  "SM" | "ME" | "LA" | "2XL";
  let Sizes: TSizes;

  function greet(parametro1: UserID, parametro2: TSizes){
    return typeof parametro1 === "string" 
    ? console.log("Ropa: (+)>", `usuario: ${parametro1.toLocaleLowerCase()}`, `tamaño: ${parametro2}`) 
    : null;
  };
  greet("Nicolas","2XL");
  greet("Molina","LA");
})();

Por si alguien no sabe:
camelCase (primera minúscula, y despues sigue en mayusculas)
PascalCase (todo en mayúscula)

Les comparto mis apuntes del Curso de Fundamentos de TypeScript 2020. 😄

Literal alias

• TypeScript permite crear un alias como nombre para un tipo.
• El alias se puede aplicar también a un conjunto o combinación de tipos.
• Se usa la palabra reservada type.
• Nos ayudan a evitar la redundancia en los nombres de tipos.
• Los podemos usar como un tipo de dato más.

Sintaxis

type TypeName = datatype1 | ... | datatypeN;

Literal types

• Una variable con un tipo literal puede contener únicamente una cadena del conjunto.
• Se usan cadenas como “tipos”, combinados con el símbolo de pipe (’|’) entre ellos.
• Son tipos de datos “personalizados”.
• Lo utilizamos para tener un conjunto acotado de opciones.

Sintaxis

type TypeName = 'datatype1'| ... | 'datatypeN';

TS haciendo lo que JS debería hacer desde el principio. Me cae bien TS. 😄

Me está gustando lo que nos ofrece TS 😄

Aqui esta la url del github en la rama de esta clase:

https://github.com/platzi/curso-typescript-fundamentos/tree/13-step

Cerca del minuto 2:50 el profe dice que hace uso de camellCase, pero en realidad es PascalCase la forma correcta de llamarlo cuando empieza con mayuscula tengo entendido.

También podemos utilizar el operador typeof para obtener el tipo de un tipo en tiempo de compilación. Por ejemplo

let y: string = 'hello';
let z: typeof y = 'world';

Acá usamos el operador typeof para obtener el tipo de la variable y y asignarselo a la variable z. Esto significa que z será de tipo string.

Literal types es cmo un enumerador de Java

realicé este condicional adicional para que al momento de ingresar la talla o tamaño “traduzca” las letras por su especificación en este caso, (pequeño, mediano,grande y extra grande),! no es la gran cosa pero quise adicionar esto.
(()=>{
type UserID = string | number | boolean;
let userId: UserID;

// Literal Types
type Sizes = “S” | “M” |“L” | “XL”;
let shirtSize: Sizes;
function greeting(userId: UserID, size: Sizes){
if(typeof userId === ‘string’ && size === ‘S’){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es pequeña);
}else if(typeof userId === ‘string’ && size === ‘M’){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es mediana);
}else if(typeof userId === ‘string’ && size === ‘L’){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es grande);
}else if(typeof userId === ‘string’ && size === ‘XL’){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es extra grande );
}else{
console.log(‘La información recibida no es correcta’)
}
}
greeting(‘1111’,‘S’);
greeting(‘1111’,‘XL’);
})();

Alias en TS

Los alias en TS nos ayudan a crear nuestros propios tipos de datos para asi hacer nuestro codigo mas escalable.

// Sin alias
let user = string | number | Object;

function createUser(user: string | number | Object){
  @code...
}

// Con alias
type UserType = string | number | Object

let user: UserType

function createUser(user: UserType){
  @code...
}

Asi tenemos una fuente de verdad en nuestros tipo de datos.
.

Tipos literales

Estos son casi lo mismo, pero aqui podemos costumizar aun mas, ya que agregamos valores especificos

type SizesType = "S" | "XS" | "M" | "L" | "XL" | "XXL"

Asi, cualquier variable con el tipo de dato SizesType va poder elegir solo una de las opciones disponibles.

TypeScript es como java y javaScript a la vez

La creación de variables personalizadas es muy potente cuando trabajamos con interfaces, tal vez es muy pronto para eso pero para que lo tengan en mente (los casos de uso más comunes).

Estos Literal Types son la gota que derramaron el vaso! Me encanta TypeScript!

Alias and literal types

En TypeScript, se encuentran comúnmente conjuntos de tipos que se repiten en un proyecto. Para evitar reescribir estos tipos, debe usar la palabra clave type y definir el conjunto de tipos con su respectivo nombre.

// Ejemplo antes ❌
let beauty_type: string | number | boolean;

function which_type(userID: string | number | boolean) {
	if (typeof userID == 'string') {
		  console.log('Soy string:', { userID });
	} else if (typeof userID == 'number') {
		  console.log('Soy number:', { userID });
	} else {
		console.log('Soy bool:', { userID });
	}
}

// Refactoring using type 👍
type CustomSet = string | number | boolean;
let beuty_type: CustomSet;
function which_type(userID: CustomSet){}

los types se parecen a las interfaces modelo, y los literal types se parecen a los enum

Siempre tuve miedo de aprender TypeScript porque me quitaba lo que amaba de JavaScript, pero ahora me arrepiendo no haber dado el salto mucho antes, TS ❤️

Wow!!! tenía pereza de aprender ts pero es realmente potente este lenguaje de programación

Me encantó esta clase. Empiezo a ver el poder de TS

Me agrada saber que se está poniendo esto del .TS

camelCase
PascalCase
kebab-case
snake_case

crear nuestro propio tipado usando =>
type UserID = string | number | boolean
o tambien se puede usar nuestro tipado personalizado usando =>
type Talle = ‘S’ | ‘M’ | 'L’
type es una palabra reservada de ts para declarar un tipado

creo que los tipados literales pueden ser muy utiles en lo que es encapsulamiento,no se creo que podria ser una buena herramienta!!!

type: herramienta súper poderosa de TS.