Este artículo fue originalmente escrito en https://matiashernandez.dev
La palabra clave extends
Typescript es un lenguaje completo (un lenguaje completo de Turing); por lo tanto, tiene algunas palabras clave con las que trabajar. Una de ellas es extends.
Esta palabra clave puede ser muy confusa ya que engloba un par de conceptos o significados que dependen del contexto en el que se utilice.
Herencia con extends
La herencia en Typescript se refiere a permitir crear nuevas interfaces que heredan o extienden el comportamiento de una anterior.
interface User {
firstName: string;
lastName: string;
email: string;
}
interface StaffUser extends User {
roles: Array<Role>
}
Lo que se puede ver en el fragmento anterior es:
- La interfaz
Userdescribe un tipo con algunas propiedades que representan a un usuario. - La interfaz
StaffUserrepresenta a un usuario con las mismas propiedades queUserpero además una más: roles. - Este uso de extends se puede utilizar para heredar de múltiples interfaces simultáneamente con sólo utilizar nombres separados por comas de las interfaces base.
interface StaffUser extends User, RoleUser {
}
Este comportamiento también se puede utilizar para extender una Clase
extends como restricción.
También se puede utilizar extends para restringir el tipo o limitar el ámbito de un tipo.
export type QueryFunction<
T = unknown,
TQueryKey extends QueryKey = QueryKey,
> = (context: QueryFunctionContext<TQueryKey>) => T | Promise<T>
El ejemplo anterior (de una implementación real de tanstack-query) muestra un tipo llamado QueryFunction. Este es un tipo genérico que acepta dos valores: T y TQueryKey.
El uso genérico aquí es muy similar a una función en javascript, que acepta dos argumentos.
Lo que importa aquí es observar el uso de la palabra clave extends: TQueryKey extends QueryKey = QueryKey. Esto se puede leer como TQueryKey y debe ser de tipo Query con un valor por defecto de QueryKey.
El uso anterior de extends acotando o restringiendo el genérico es la piedra angular para poder implementar tipos condicionales ya que los extends se utilizarán como condición para comprobar si un genérico está fuera de un tipo determinado.
✉️ Únete a Micro-bytes 🐦 Sígueme en Twitter ❤️ Apoya mi trabajo
Top comments (2)
Veo que en TypeScript nadie prefija los nombres de interfases con
I. Yo que vengo de .Net, laIme sale automáticamente cuando defino interfases. ¿Qué suelen hacer en TS cuando nombran clases? Porque yo encuentro muy fácil declarar la claseUserque implementaIUser. El prefijoIme ayuda muchísimo en evitar colisiones de nombres.¿Qué suele hacer la gente en TS? 😕
En realidad aquí no hay una convención o estándar fuerte si no más bien preferencias personales o de equipos.
En mi experiencia no he visto mucho el uso de prefijos (
Ipara interfacesTpara tipos). Por ejemplo en el repo de tanstack-query, encuentras el uso de interfaces sin prefijo, y es una base de código bastante larga (github.com/TanStack/query/search?q...)