Introducción
TypeScript ya existe desde hace unos años y su adopción no hace más que aumentar, así que lo más probable es que, aunque no lo estés usando o no lo hayas usado personalmente, seguro que has oído hablar de él si has tenido acceso a un navegador web en los últimos dos años.
Este artículo será el primero de una serie que pretendo escribir, para resumir todos los recursos que he encontrado valiosos a lo largo de mi viaje dentro de una de las herramientas más útiles, en mi opinión personal, para escribir aplicaciones web a gran escala.
Llevo utilizando TypeScript desde finales de 2016, con el lanzamiento de la versión 2.0, y lo he utilizado en casi todos los proyectos en los que he trabajado desde entonces, y la única razón para no incluirlo en el 100% de ellos es sólo una cuestión de requisitos para los sistemas heredados.
Así pues, vamos a sumergirnos.
¿Qué es TypeScript?
Es un JavaScript que se adapta
Fue la introducción en su sitio web oficial durante mucho tiempo y ésta es probablemente la explicación más breve que puedes encontrar.
En su esencia, TypeScript es un superconjunto de JavaScript que proporciona un sistema de tipos opcional. Por ejemplo, aunque decidas utilizarlo, no estás obligado a ceñirte a él al 100%. Escribir JS plano está bien, incluso si toda tu base de código pasa por el compilador de TypeScript.
Al ser un superconjunto, cada línea de código JavaScript es también un código TypeScript válido.
Además, también proporciona las características previstas para las futuras especificaciones de la ECMA para los motores de JavaScript ya existentes.
Se puede utilizar tanto en el lado del cliente como en el del servidor, pero primero hay que compilarlo a JavaScript, ya que los navegadores y node.js no entienden la sintaxis de TypeScript. Sin embargo, los bundlers modernos como webpack, rollup o vite proporcionan plugins para los mapas de fuentes, que pueden ayudar a la depuración, con el código real que has escrito, en lugar del JavaScript compilado, difícilmente legible.
TypeScript está desarrollado y mantenido por Microsoft y funciona increíblemente sincronizado con su Visual Studio Code.
¿Por qué TypeScript?
Muchas de las personas con las que he hablado del tema aceptan inicialmente la idea con bastante escepticismo:
¿Por qué debería introducir otro marco de trabajo sobre mi código, que básicamente me hará perder tiempo en añadir sintaxis adicional en lugar de simplemente escribir un JavaScript dinámico y libremente tipado?
Estoy de acuerdo en que puede sonar contradictorio, pero a la larga, lo anterior es también una de las mayores razones para adoptar TypeScript dentro de tu base de código.
Mira el siguiente ejemplo:
let num = 999;
num = "999";El estilo dinámico de JavaScript permite la modificación del tipo en tiempo de ejecución. Así que el ejemplo anterior es absolutamente válido. La variable num está definida como un número, pero luego se convierte en una cadena. Muy silencioso y potencialmente peligroso cuando no es intencional.
El mismo bloque en TypeScript saldrá:
El tipo 'string' no es asignable al tipo 'number'.
Ahora bien, como se trata de un código JavaScript completamente válido, el compilador mostrará este error, pero seguirá emitiendo el código compilado, ya que sólo le avisará de un posible error.
Además, al tener TypeScript integrado dentro de tu IDE, que viene de fábrica con VSC, esta línea será resaltada incluso antes de llegar a la compilación, por lo que si se trata de un error, el editor te mostrará los posibles errores de tipo por adelantado, lo cual es otra gran ventaja de la seguridad de tipos.
TypeScript intentará inferir tantos tipos como sea posible, incluso si no has establecido inicialmente la salida de tipo deseada. A largo plazo, una enorme cantidad de errores comunes son anotados por el compilador, antes de que compiles el código tú mismo.
Otra gran ventaja es el soporte de archivos de definición, que contienen información de tipos para bibliotecas ya existentes, incluso si están escritas completamente en JavaScript. Hay incluso un increíble repositorio de código abierto, en constante crecimiento, de tipos generados por la comunidad para bibliotecas existentes, en gran medida y no tan populares: Definitely typed.
Además, ya hay bastantes casos de estudio de grandes empresas que están adoptando TypeScript gradualmente, como Bloomberg. Parece que el mundo entero se está moviendo hacia TypeScript, así que, como mínimo, deberías probarlo.
¿Cómo usar TypeScript?
Como se ha mencionado anteriormente, no es necesario empezar de cero. TypeScript puede ser adoptado en cualquier proyecto, independientemente de la escala. Incluso si cambias la extensión de tus archivos .js a .ts, se ejecutarán a través del compilador, ya que el código sigue siendo válido, aunque no esté correctamente tipado.
Lo único que necesitas es el compilador. Y aquí tienes bastantes opciones. La forma más sencilla es instalar el compilador globalmente con:
npm install -g typescript
Lo que le dará acceso al comando tsc en su terminal y se le permitirá ejecutar el compilador en cualquier archivo ts como:
tsc myfile.ts
Por supuesto, con la constante introducción de nuevos frameworks y bundlers, esta no es la forma más eficiente, pero es la oficial y más sencilla.
Entraré en más detalle en el próximo artículo, sobre posibles boilerplates y opciones de compilación.
Conclusión:
Como he mencionado al principio, esta historia es la primera de toda una serie que voy a publicar semanalmente y en el que podremos ahondar un poco más en la dinámica y en el porqué de la adopción de esta tecnología que, no lo dudes, me ha cambiado la forma de desarrollar web.
