You don't have access to this class

Keep learning! Join and start boosting your career

Aprovecha el precio especial y haz tu profesión a prueba de IA

Antes: $249

Currency
$209
Suscríbete

Termina en:

0 Días
5 Hrs
25 Min
25 Seg
Curso de TypeScript

Curso de TypeScript

Nicolas Molina

Nicolas Molina

Objetos como tipos

20/24
Resources

In TypeScript we can also use Aliases to define the type structure that an object should have:

//TypeScripttype userData = { username: string, email: string}

And then this "new type" can be used in an array, for example, to define the typing of the objects we want to add:

//TypeScripttype userData = { username: string, email: string}let usersList: userData[] = []; usersList.push({ username: "freddier", //CORRECTemail: "[email protected]", //CORRECT}); usersList.push({ username: "cvander", //CORRECTemail: true, // ERROR.  Must be of type string and NOT of type boolean});

Contribution created by: Martín Álvarez.

Contributions 38

Questions 8

Sort by:

Want to see more contributions, questions and answers from the community?

Nicolas, en realidad hasta este punto del curso estoy muy emocionado y mi perspectiva de TS cambio por completo, en realidad estoy completamente seguro de implementar TS en mis futuros proyectos con React y aumentar mis skills.

En caso de que se quiera usar el destructuring se puede hacer de las siguiente manera

type Product = {
    title: string;
    createdAt: Date;
    stock: number;
    size?: Sizes;
  };

  const printProduct = ({ title, createdAt, stock, size }: Product) => {
    console.log(title);
    console.log(createdAt);
    console.log(stock);
    console.log(size);
  };

A partir de ahora voy a forzarme a relizar todos los proyectos que pueda siempre en TypeScript si tengo elección.

yo preferiria usar interfaces para poder extenderlas si es que se quieran agregar mas tipos y llevar un mejor ordern.

<
interface Product {
        title: string;
        createdAt: Date;
        stock: number;
        size?: Sizes;
    }
> 

Una debilidad de los type es uqe no son extensibles o no se les puede agragar mas propiedades luego de ser definidos

Pensar en todas las posibilidades de implementacion!
Creo que alguien esta pensando en rehacer varios proyectos en TS :man

brutal

el contenido de la clase:

(() => {
  type Sizes = 'S' | 'M' | 'L' | 'XL';
  type product={
    title:string,
    createdAt:Date,
    stock:number;
    size?:Sizes
  };

  const products:any[]=[];

  const addProduct=(data:product) =>{
    products.push(data);
  }

  addProduct({
    title:"Pro1",
    createdAt:new Date(1993,1,1),
    stock:12
  });
  console.log(products);

  addProduct({
    title:"Pro2",
    createdAt:new Date(1993,1,1),
    stock:12,
    size:"XL"
  });
  console.log(products);
  products.push({
    title:"Prod3",
    createdAt:new Date(1992,1,1),
    stock:12,
    size:"XL"
  })

})();

Con los type Alias también podemos definir la estructura de un objeto como tipo de dato. Por lo que ahora podriamos hacer lo siguiente:

type Product = {
  title: string,
  createdAt: Date,
  stock: number,
  size?: Sizes
}

const products: Product[] = [];

const addProduct = (data: Product){
  @code...
}

Y ahora podriamos reutilizar el tipo Product justo como lo hacemos con el tipo Sizes

Siento que TypeScript es como el hijo entre C# y JavaScript jaja

¡Nicolás explica demasiado bien, hace que lo complejo se vea fácil, gran tutor!

Gracias, Gracias !!! haces que todo tenga sentido!!

No está disponible el video. Muestra el siguiente mensaje: ‘The media could not be loaded, either because the server or network failed or because the format is not supported.’

La gente generalmente se va por modas y por lo que dicen otros, me pasaba a mi, en vez de experimentar las cosas ellos mismos. En vez de eso, debemos de preguntarnos, ¿Qué problema resuelve esta herramienta? Y el problema que resuelve es que a JavaScript su flexibilidad le juega en contra cuando se trata de desarrollar proyectos largos y con muchas funcionalidades. Hay que acotar esa flexibilidad a fin de hacer código más mantenible y es ahi donde typescript entra en escena.
Interesante el tipo type

De verdad Typescript le da superpoderes a JavaScript, un excelente curso sin duda, Nicolas es todo un experto

(() => {
  type DataObj = {
    email: string
    password: string
    age: number
  }
  const dataObjList : DataObj[] = []
  const obj1 : DataObj = {
    email: 'asdsa',
    password: 'asds',
    age : 13
  }
  const obj2 : DataObj = {
    email: 'dfdsf',
    password: 'dfdf',
    age : 24
  }
  dataObjList.push(obj1,obj2)
  console.log(dataObjList);

})()



Yo antes le huía a TypeScript, pero ahora lo veo desde una perspectiva mas amigable y definitivamente lo voy a implementar a mis proyectos React de forma obligatoria para acostumbrarme a su uso y ya despues sea algo natural en mi.

Ya quiero usar TypeScript + Vue 3

Excelente

Tenía muchas dudas al implementar TS y con este curso ya tengo mucho más claridad. Que buen curso.

Que potente

Mi cerebro en el minuto 1:30 xD

DIOSS como no lo pensé :0
Esto ayuda muchísimo en las APIS

Entré al curso con 0 expectative de que me fuese a gustar TS y la verdad lo estoy amando es genial! ♥

En fastApi que se trabaja en python, al trabajar con tipado, se trabaja practicamente igual

Genial lo he venido usando desde que comenzó el año y me quedo con TS.
Ayuda a tener mejores practicas para desarrollar aplicaciones y además permite aplicar POO.

excelente curso! le tenia miedo a TS, pero la manera que explica el profesor es un lujo! 💪🏼

Cada ves se coloca mas emocionante TS , esta herramienta la vi en un directo y me parecio genial https://quicktype.io/typescript (Tiene Extension para VSCODE)

Muy padre todo el curso

Ya han pasado varios meses desde el lanzamiento del curso y mi prespectiva de Typescript ha cambiado, ahora si me doy cuenta que la ayuda es maxima al momento de codear

Bastante práctico definir el tipado de objetos, Typescript hace que el código esté mucho más ordenado y prolijo.

No sé por qué, pero me parece que TS no es tan complicado.

Con lo visto hasta esta calse nuestro example de las primeras clases quedaria así.

(async ()=> {

  type Products = {
    id: number,
    title: string,
    price: number,
    description: string,
    category: object,
    images: [],
  }
  const myCart = [];
  const products: Products[] = [];
  const limit:number = 2;
   const url:string;

  async function getProducts() {
    const rta = await fetch(url, {
      method: 'GET'
    });
    const data = await rta.json();
    products.push(data);
  }
  function getTotal() {
    let total = 0;
    for (let i = 0; i < products.length; i++) {
      total += products[i].price;
    }
    return total;
  }
  function addProduct(index: number) {
    if (getTotal() <= limit) {
      myCart.push(products[index]);
    }
  }

  await getProducts();
  addProduct(1);
  addProduct(2);
  const total = getTotal();
  console.log(total);
  const person = {
    name: 'Nicolas',
    lastName: 'Molina'
  }
  /* const rta = person +  limit;
  console.log(rta); */
});

The media could not be loaded, either because the server or network failed or because the format is not supported.

Esta clase no carga

Excelente Nicolas, hace ver las cosas más simples para aprender.