¡Te invitamos a ver todos los artículos que tenemos para ti, coméntanos que tal te pareció este articulo y compártelo con más personas!

Los desarrolladores de aplicaciones cliente interactúan con API diariamente. Estandarizar las respuestas de las API según el éxito de las operaciones o la lógica empresarial es una práctica esencial. Normalmente, una respuesta API incluye campos estándar como status y error, permitiendo a los desarrolladores reaccionar adecuadamente y mejorar la experiencia del usuario. Por ejemplo, un registro exitoso debería cerrar el formulario y mostrar un mensaje de confirmación, mientras que los errores de validación deben mostrarse en el formulario si los datos son incorrectos.

Esto plantea la cuestión de cómo describir rápida y flexiblemente los tipos de respuesta en un proyecto.

El Problema de Tipos de Respuesta Únicos

A veces, los proyectos describen tipos de respuesta utilizando un solo tipo con muchos parámetros opcionales. Aunque esto puede parecer suficiente, ya que TypeScript sugiere estos parámetros al escribir el código, requiere comprobaciones adicionales para asegurar su presencia. Por ejemplo, un tipo básico podría ser:

typescriptCopiar códigotype ApiResponse = {
  status: string;
  data?: any;
  errors?: any[];
};

La ventaja de este enfoque es su simplicidad, pero tiene una desventaja significativa: la falta de transparencia. No se sabe exactamente cuál será la respuesta para una solicitud específica, y es necesario revisar el código para entender todas las variantes posibles.

Obtén descuentos exclusivos de nuestros cursos en vivo en línea

Capacítate con los expertos

Solución: Tipos de Utilidades Personalizados

Podemos mejorar esto utilizando tipos de utilidades personalizados. Cada escenario de respuesta (operación exitosa, error del servidor, error de validación o redirección) tendrá su propio tipo independiente. Estos tipos se pueden usar de forma individual o combinada para reflejar todas las opciones posibles.

typescriptCopiar códigotype SuccessResponse<T> = {
  status: 'ok';
  data: T;
};

type ValidationErrorResponse = {
  status: 'form_errors';
  errors: any[];
};

type ErrorResponse = {
  status: 'error';
  message: string;
};

type ApiResponse<T> = SuccessResponse<T> | ValidationErrorResponse | ErrorResponse;

Ejemplos Prácticos

Veamos cómo se verían estos tipos en un proyecto:

typescriptCopiar códigofunction updateUserProfile(data: UserProfile): ApiResponse<UserProfile> {
  // Lógica de actualización de perfil
}

En este caso, TypeScript entiende que el status‘ correspondiente tendrá los campos esperados, y que el valor user puede ser undefined‘ en todos los tipos de respuesta excepto en la correcta. Esto facilita la gestión de las respuestas y reduce la posibilidad de errores.

Conclusión

Implementar tipos de utilidades personalizados mejora significativamente la experiencia del desarrollador, alineando los tipos de respuesta con los posibles escenarios que la API puede proporcionar. Esto evita errores al usar valores no disponibles en ciertos tipos de respuesta y elimina la necesidad de revisar la implementación del procesamiento de respuestas en el código para entender los tipos de respuestas reales. Con estos tipos personalizados, se puede ver el panorama completo de inmediato, mejorando la eficiencia y claridad del desarrollo.

¡Te invitamos a ver todos los artículos que tenemos para ti, coméntanos que tal te pareció este articulo y compártelo con más personas!

About Author

Kim Tapia

0 0 votos
Article Rating
Suscribir
Notificar de
guest
0 Comments
Comentarios.
Ver todos los comentarios
0
¿Te gusta este articulo? por favor comentax