Utilidades Flatten y UnwrapPromise
Escriba tipos que desenvuelvan estructuras genéricas anidadas.
Utilidades Flatten y UnwrapPromise es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 4 lecciones en total.
El problema de Flatten
Los arrays de JavaScript pueden estar anidados. Un tipo de utilidad Flatten elimina recursivamente los envoltorios de array de un tipo y devuelve el tipo del elemento más interno.
type Flatten<T> = T extends (infer U)[] ? Flatten<U> : T;
type A = Flatten<number[][][]>; // number
type B = Flatten<string[]>; // stringFlatten no recursivo (un nivel)
Un aplanamiento de un solo nivel equivale a Array.prototype.flat(1): desenvuelve exactamente un nivel de anidamiento.
type FlatOnce<T> = T extends (infer U)[] ? U : T;
type A = FlatOnce<number[][]>; // number[]
type B = FlatOnce<string[]>; // stringFlatten recursivo
La versión recursiva imita Array.prototype.flat(Infinity) al continuar la recursión hasta que no quedan más envoltorios de array.
type Flatten<T> = T extends (infer U)[] ? Flatten<U> : T;
type C = Flatten<boolean[][][]>; // booleanUnwrapPromise: un nivel
Desenvuelva una única capa de Promise mediante infer.
type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
type D = UnwrapPromise<Promise<string>>; // string
type E = UnwrapPromise<number>; // numberUnwrapPromise profundo
Desenvuelva recursivamente las promesas anidadas; es equivalente al tipo integrado Awaited.
type DeepUnwrap<T> = T extends Promise<infer U> ? DeepUnwrap<U> : T;
type F = DeepUnwrap<Promise<Promise<number>>>; // numberCombinar Flatten y UnwrapPromise
Un tipo combinado gestiona tanto promesas como arrays, lo que resulta útil para funciones asíncronas que devuelven arrays.
type Simplify<T> =
T extends Promise<infer U> ? Simplify<U>
: T extends (infer V)[] ? Simplify<V>
: T;
type G = Simplify<Promise<string[][]>>; // stringAwaited<T> integrado
TypeScript 4.5 y posteriores incluye Awaited, que desenvuelve recursivamente los tipos thenable, incluidos los thenable que no son promesas.
type H = Awaited<Promise<Promise<string>>>; // string
// Also handles custom thenables with .then()Desenvolver valores de Map
El mismo patrón con infer extrae los tipos de valor de Map.
type MapValue<T> = T extends Map<any, infer V> ? V : never;
type I = MapValue<Map<string, number[]>>; // number[]FlattenObject: combinar interfaces anidadas
Un aplanador de objetos a nivel de tipos combina tipos de objetos anidados; es más complejo, pero resulta útil para combinar configuraciones profundamente anidadas.
// This requires recursive mapped types + intersection spreading
// See the DeepPartial lesson for the base patternUso práctico: desenvolver respuestas de API
Desenvuelva los envoltorios anidados de las respuestas de API para obtener el tipo de datos sin afirmaciones de tipo manuales.
type ApiData<T> = { data: T; status: number };
type ExtractData<T> = T extends ApiData<infer D> ? D : T;
type J = ExtractData<ApiData<User[]>>; // User[]Resumen: Flatten y Unwrap
Flatten y UnwrapPromise utilizan tipos condicionales recursivos con infer para eliminar los envoltorios de tipos. Use Awaited para desenvolver promesas y escriba una recursión personalizada para otras estructuras.
Comprobación rápida
¿Qué devuelve Flatten?
Lo que ha aprendido
Flatten y UnwrapPromise son tipos condicionales recursivos que eliminan envoltorios genéricos. Combínelos para simplificar tipos anidados complejos y use el tipo integrado Awaited para cadenas de promesas.
Aprende TypeScript con un tutor de IA — gratis
Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.
- Cursos
- 101
- Lecciones
- 352
Preguntas frecuentes
¿La lección «Utilidades Flatten y UnwrapPromise» es gratis?
Sí — el texto completo de «Utilidades Flatten y UnwrapPromise» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Utilidades Flatten y UnwrapPromise»?
Escriba tipos que desenvuelvan estructuras genéricas anidadas. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar TypeScript Academy?
No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.
¿Cuánto tiempo toma la lección «Utilidades Flatten y UnwrapPromise»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?
Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- DeepPartial y DeepReadonly
- Utilidades Flatten y UnwrapPromise
- TupleToUnion y UnionToIntersection
- Publicación de una biblioteca de utilidades de tipos