No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Aprende todo un fin de semana sin pagar una suscripci贸n 馃敟

Aprende todo un fin de semana sin pagar una suscripci贸n 馃敟

Reg铆strate

Comienza en:

3D
20H
15M
44S

Alias y tipos literales

15/24
Recursos

Los Alias nos permiten darle un nombre a uno o varios tipos de datos en conjunto. Un ejemplo de como se definen ser铆a as铆:

type UserID = string | boolean | number;

隆Ahora UserID lo podemos usar como si fuese un tipo de dato string, boolean o number!

let dynamicVar: UserID = "300";

dynamicVar = true;
dynamicVar = 200;

Los Union Types que vayamos a utilizar ahora ser谩n menos tediosos de escribir, pues con los Alias podemos utilizar el mismo conjunto de tipos de datos en la definici贸n de varias variables, benefici谩ndonos en escribir menos c贸digo.

type UserID = string | boolean | number;

let dynamicVar: UserID = "300";

function helloUser( userId: UserID ) {
    console.log(`Un saludo al usuario con el n煤mero de id ${userId}`);
}

Nota: la palabra type en los Alias es algo propio de TypeScript.

Tipos Literales (Literal Types)

Gracias a esto podemos definir expl铆cita y literalmente los posibles valores que puede tomar nuestra variable. Por ejemplo:

let shirtSize: "S" | "M" | "L" | "XL";

shirtSize = "M"; //CORRECTO
shirtSize = "S"; //CORRECTO
shirtSize = "qwrty"; //ERROR. No est谩 en las opciones.
shirtSize = "SS"; //ERROR. Letra de m谩s.
shirtSize = "m"; //ERROR. Est谩 en min煤scula.

Definimos que la variable shirtSize pueda ser una de las 4 posibles opciones de valores, que estos sean de tipo string y que est茅n en may煤scula, por tanto, si queremos asignar un valor que no sea exactamente como lo declaramos, TypeScript nos mostrar谩 un error.

Alias + Tipos Literales

Tambi茅n podr铆amos combinarlas para facilitar a煤n m谩s el desarrollo de nuestro programa:

type Sizes = 'S' | 'M' | 'L' | 'XL';

let shirtSize: Sizes;
shirtSize = "M";

function yourSize( userSize: Sizes ){
    console.log(`Tu medida es ${userSize}`);
}

Contribuci贸n creada por: Mart铆n 脕lvarez.

Aportes 25

Preguntas 4

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

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 鈥渢ipos鈥, combinados con el s铆mbolo de pipe (鈥檤鈥) entre ellos.
  • Son tipos de datos 鈥減ersonalizados鈥.
  • 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 鈥渢raduzca鈥 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 = 鈥淪鈥 | 鈥淢鈥 |鈥淟鈥 | 鈥淴L鈥;
let shirtSize: Sizes;
function greeting(userId: UserID, size: Sizes){
if(typeof userId === 鈥榮tring鈥 && size === 鈥楽鈥){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es peque帽a);
}else if(typeof userId === 鈥榮tring鈥 && size === 鈥楳鈥){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es mediana);
}else if(typeof userId === 鈥榮tring鈥 && size === 鈥楲鈥){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es grande);
}else if(typeof userId === 鈥榮tring鈥 && size === 鈥榅L鈥){
console.log(Usuario: ${userId.toUpperCase()} la talla de tu camisa es extra grande );
}else{
console.log(鈥楲a informaci贸n recibida no es correcta鈥)
}
}
greeting(鈥1111鈥,鈥楽鈥);
greeting(鈥1111鈥,鈥榅L鈥);
})();

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 = 鈥楽鈥 | 鈥楳鈥 | '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.