TypeScriptLección 15 de 16

async/await y Promise tipadas

Promise<T> es la promesa de entregar un poco más tarde un valor de tipo T. await desenvuelve ese valor y TypeScript conoce su tipo.

Lo esencial

Una función async siempre devuelve una Promise: async function load(): Promise<string>.
await fetchUser(1) tiene el tipo User, no Promise<User>.
Promise.all espera varias promesas y conserva sus tipos: [User, User].
En catch el error es unknown, así que compruébalo con instanceof Error.

Ejemplo

interface User {  id: number;  name: string;} // A stand-in for a real API call: it answers with a ready Promisefunction fetchUser(id: number): Promise<User> {  return Promise.resolve({ id, name: id === 1 ? "Ada" : "Linus" });} async function greet(id: number): Promise<string> {  const user = await fetchUser(id); // user: User  return `Hi, ${user.name}`;} async function main(): Promise<void> {  console.log(await greet(1));  const [a, b] = await Promise.all([fetchUser(1), fetchUser(2)]); // [User, User]  console.log(`${a.name} & ${b.name}`);} main();

fetchUser sustituye a una petición real al servidor, por eso el resultado siempre es el mismo. Promise.all devolvió una tupla, y a.name y b.name ya son textos.

Tarea

Cómo usar el editor⌘ Enter o Ctrl Enter ejecuta el código, ⇧ ⌘ Enter comprueba la tarea.Tab y Mayús Tab sangran la línea o la selección; Esc y luego Tab sale del editor.La comprobación compara lo que imprimió el programa con la tarea; los espacios al final de línea no cuentan.Tras dos comprobaciones fallidas puedes ver la solución. Tu código se guarda en este navegador.

Haz que getPrice rechace los productos desconocidos con un error, convierte total en async para sumar con Promise.all y que main imprima «Order 1: 11» y «Order 2 failed: No price for pizza».

const PRICES: Record<string, number> = { tea: 3, cake: 5 }; // TODO: resolve with the price, or reject with// new Error(`No price for ${item}`) when the item is unknownfunction getPrice(item: string): Promise<number> {  return Promise.resolve(PRICES[item]);} // TODO: make it async and return Promise<number>:// await Promise.all(items.map(getPrice)) and add the prices upfunction total(items: string[]): number {  return items.length;} async function main(): Promise<void> {  console.log(`Order 1: ${total(["tea", "cake", "tea"])}`);  // TODO: try total(["tea", "pizza"]) and in catch print  // "Order 2 failed: <error message>"} main();

const PRICES: Record<string, number> = { tea: 3, cake: 5 };

// TODO: resolve with the price, or reject with
// new Error(`No price for ${item}`) when the item is unknown
function getPrice(item: string): Promise<number> {
  return Promise.resolve(PRICES[item]);
}

// TODO: make it async and return Promise<number>:
// await Promise.all(items.map(getPrice)) and add the prices up
function total(items: string[]): number {
  return items.length;
}

async function main(): Promise<void> {
  console.log(`Order 1: ${total(["tea", "cake", "tea"])}`);
  // TODO: try total(["tea", "pizza"]) and in catch print
  // "Order 2 failed: <error message>"
}

main();

Salida

Aquí aparecerá lo que imprima el programa.