TypeScript 4.0 finalmente tiene lo que estaba esperando

El 6 de agosto de este año, Microsoft anunció el lanzamiento de la versión candidata de TypeScript 4.0. Hay soporte para elementos de tupla etiquetados . Y esto es exactamente lo que estaba esperando en TypeScript.

En la parte superior están los argumentos a los que se les han asignado etiquetas significativas. A continuación se muestran argumentos con nombres inútiles.



¿Por qué estaba esperando esto? Permítanme explicar esto usando el ejemplo de desarrollo de una función.

Interfaz generalizada que admite el manejo flexible de argumentos

He aquí un ejemplo simplificado. Se basa en el uso de la interfaz IQuery. La interfaz está destinada a describir las características de las funciones que realizan solicitudes para obtener algo. Siempre devuelve una promesa y acepta un genérico que describe lo que devuelve una promesa ( TReturn). Esta interfaz es bastante flexible, puede usarla al crear funciones que no toman argumentos o toman un número desconocido de argumentos ( UParams extends any[] = []).

interface IQuery<TReturn, UParams extends any[] = []> {
  (...args: UParams): Promise<TReturn>
}

Función bajo prueba: findSongAlbum ()

Nosotros, usando esta interfaz, escribiremos una función que busque álbumes de música por título de canción ( title) y artista ( artist). Devuelve una promesa que devuelve un solo objeto de tipo Album:

type Album = {
  title: string
}

Sin TypeScript, el código para dicha función se vería así:

const findSongAlbum = (title, artist) => {
  //   ...
  
  const albumName = '1989';
  return Promise.resolve({
     title: albumName
  });
}

Si escribe una función de este tipo en TypeScript y usa la interfaz IQuery, debe pasar el tipo como primer parámetro genérico Album. Esto asegura que la forma de lo que devuelve la promesa siempre coincidirá con el tipo Album.

const findSongAlbum: IQuery<Album> = (title, artist) => {
  //   ...
  
  const albumName = '1989';
  return Promise.resolve({
     title: albumName 
  });
}

Código escrito antes de TypeScript 4.0

Al desarrollar nuestra función, también necesitamos declarar los parámetros e indicar qué tipos tienen. En este caso, titley artistson cadenas. Declaremos un nuevo tipo ,, Paramsy pasémoslo como el segundo tipo de IQuery.



Un ejemplo escrito sin aprovechar las nuevas funciones de TypeScript 4.0 Paramsestará representado por una lista de tipos. Cada elemento de esta lista define el tipo de argumento. Esto se hace en el mismo orden en que aparecen los argumentos cuando se declara la función. Este es un ejemplo de uso de tuplas .

type Params: [string, string]
const findSongAlbum: IQuery<Album, Params> = (title, artist) => {
  //   ...
  
  const albumName = '1989';
  return Promise.resolve({
     title: albumName
  });
}

Al analizar el tipo Params, puede descubrir que su primer elemento string,, asigna el tipo al stringprimer argumento, es decir, - title. El segundo argumento, que también parece string, naturalmente, seguir la misma línea de razonamiento, asigna un tipo al stringsegundo argumento - artist. Esto hará que el tipo de lista de argumentos sea seguro.



Intentemos trabajar con esta función.





Las sugerencias para findSongAlbum () muestran etiquetas de argumentos sin sentido



. Desafortunadamente, este enfoque para usar tuplas no nos da nombres de argumentos de código útiles y confiables (etiquetas) cuando trabajamos con una función. En cambio, se nos dice que los argumentos de la función sonargs_0: string, args_1: string... De esta publicación, solo puedo aprender, por ejemplo, que el primer argumento debe ser de tipo string. La etiqueta arg_0no me dice que el primer parámetro de la función deba ser el nombre ( title) de la composición musical que estoy buscando.

Código que aprovecha las características de TypeScript 4.0

Ahora, con el lanzamiento de la versión candidata de TypeScript 4.0, tenemos tuplas etiquetadas a nuestra disposición. Podemos usarlos para describir no solo el tipo, sino también el contenido semántico de las listas de parámetros de la función.



Ahora a cada elemento del tipo Paramsse le proporcionará una etiqueta que se mostrará en el IDE cuando se use la función findSongAlbum:

type Params: [title: string, artist: string]
const findSongAlbum: IQuery<Album, Params> = (title, artist) => {
  //   ...
  
  const albumName = '1989';
  return Promise.resolve({
     title: albumName
  });
}

Y así es como se ve trabajar con esta función.





Las sugerencias para findSongAlbum () muestran etiquetas de argumentos para ayudarnos a comprender el significado de estos argumentos, lo cual es bastante útil.Como



puede ver, ahora, en lugar de una sugerencia de vista, se arg_0: stringnos da una pista title: string. Esto significa que ahora sabemos no solo que a la función se le debe pasar una cadena, sino también qué debe contener exactamente esta cadena.



¿Qué es lo que te falta especialmente en TypeScript?