Cómo utilizar las afirmaciones de tipo en TypeScript

Las afirmaciones de tipo en TypeScript son una forma de indicarle al compilador que usted sabe más sobre el tipo de un valor que él. Esto puede resultar útil cuando trabaja con valores que tienen tipos inciertos o amplios y desea limitarlos para una mejor verificación de tipos y legibilidad del código. En este artículo, exploraremos cómo usar las afirmaciones de tipo de TypeScript de manera eficaz.

¿Qué es la aserción de tipo?

La aserción de tipo es un mecanismo en TypeScript que permite anular la inferencia de tipo predeterminada realizada por el compilador de TypeScript. No cambia el tipo real en tiempo de ejecución, pero ayuda al compilador a comprender el tipo de una variable para fines de verificación de tipo. Las aserciones de tipo son similares a la conversión de tipo en otros lenguajes como C# o Java, pero sin ningún impacto en el tiempo de ejecución.

Sintaxis de las afirmaciones de tipo

Hay dos formas de utilizar afirmaciones de tipo en TypeScript:

  • Uso de la palabra clave as (recomendado)
  • Uso de corchetes angulares <>

Uso de la palabra clave as

La forma más común de utilizar aserciones de tipo es con la palabra clave as:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue as string).length;

console.log(strLength); // Output: 17

En este ejemplo, le decimos a TypeScript que someValue es del tipo string, lo que nos permite usar la propiedad length.

Uso de corchetes angulares <>

La sintaxis alternativa para las afirmaciones de tipo utiliza corchetes angulares:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue).length;

console.log(strLength); // Output: 17

Esta sintaxis logra el mismo resultado que la sintaxis as. Sin embargo, no se recomienda en entornos donde se utiliza JSX (como React), ya que entra en conflicto con la sintaxis de los elementos JSX.

Casos de uso comunes para afirmaciones de tipo

Las afirmaciones de tipo se utilizan comúnmente en varios escenarios:

  • Al trabajar con el tipo unknown
  • Al manipular elementos DOM
  • Al limitar los tipos de unión
  • Al interactuar con bibliotecas de terceros que carecen de definiciones de tipos

Ejemplo: Afirmación de tipos con el tipo unknown

El tipo unknown es útil cuando se desea aceptar cualquier tipo pero aún se necesita realizar alguna comprobación de tipos antes de usarlo. Las afirmaciones de tipo ayudan a limitar el tipo:

function getLength(value: unknown): number {
  if (typeof value === "string") {
    return (value as string).length;
  } else if (Array.isArray(value)) {
    return (value as any[]).length;
  }
  return 0;
}

console.log(getLength("Hello")); // Output: 5
console.log(getLength([1, 2, 3])); // Output: 3
console.log(getLength(42)); // Output: 0

En este ejemplo, usamos aserciones de tipo para indicar a TypeScript que value es una string o una matriz any[].

Ejemplo: Manejo de elementos DOM

Al manipular el DOM, TypeScript necesita conocer el tipo específico de un elemento para proporcionar las propiedades y los métodos adecuados. Las afirmaciones de tipo son útiles en este caso:

const inputElement = document.getElementById("user-input") as HTMLInputElement;
inputElement.value = "Hello, TypeScript!";

Aquí, usamos la aserción de tipo para indicarle a TypeScript que inputElement es un HTMLInputElement, lo que nos permite acceder directamente a la propiedad value.

Afirmación de tipo vs. Conversión de tipo

Es fundamental comprender la diferencia entre la aserción de tipo y la conversión de tipo. En TypeScript, las aserciones de tipo no cambian el tipo real en tiempo de ejecución; solo le indican al compilador de TypeScript cómo tratar el tipo en tiempo de compilación. Por el contrario, la conversión de tipo en otros lenguajes como C# o Java puede implicar la conversión de un valor de un tipo a otro en tiempo de ejecución, lo que podría afectar el rendimiento y el comportamiento.

Precauciones al utilizar afirmaciones de tipo

Si bien las afirmaciones de tipo pueden ser poderosas, el uso incorrecto puede provocar errores de ejecución. A continuación, se ofrecen algunos consejos para usarlas de forma segura:

  • Evite utilizar afirmaciones para convertir a la fuerza tipos incompatibles.
  • Utilice siempre las afirmaciones con precaución y prefiera restringir los tipos utilizando las protecciones de tipos de TypeScript.
  • Utilice afirmaciones cuando esté seguro acerca del tipo y cuando no sea posible limitarlo de otra manera.

Ejemplo de afirmación de tipo incorrecta

He aquí un ejemplo de una afirmación de tipo peligrosa:

let someValue: string = "Hello, TypeScript!";
let numValue: number = (someValue as unknown as number); // Dangerous!

console.log(numValue); // Output: Hello, TypeScript! (incorrect)

Este código se compila sin errores, pero provocará un comportamiento inesperado en tiempo de ejecución porque la cadena se trata incorrectamente como un número.

Conclusión

Las afirmaciones de tipo en TypeScript proporcionan una forma de anular los tipos inferidos cuando se sabe más sobre el tipo de un valor que TypeScript. Son útiles cuando se trabaja con tipos inciertos, se interactúa con bibliotecas de terceros o se trabaja con elementos DOM. Sin embargo, se deben utilizar con precaución para evitar errores de tiempo de ejecución y garantizar la seguridad de tipos en el código.

Si domina las afirmaciones de tipo, podrá escribir código TypeScript más expresivo y sólido. Practique su uso en distintos escenarios para familiarizarse con esta potente función.