Cómo portar su programa JavaScript a TypeScript

Lanzado originalmente en 1995 después de un período de desarrollo asombrosamente corto, JavaScript se ha convertido desde entonces en una parte integral de muchos sitios y aplicaciones. Hoy en día, JavaScript ha encontrado un hogar tanto en aplicaciones del lado del cliente como del lado del servidor. Los desarrolladores aún solicitan muchas funciones, a pesar de todos los cambios que ha experimentado a lo largo de los años.

TypeScript es un lenguaje de secuencias de comandos que amplía JavaScript con muchas de estas características tan esperadas. La anotación de tipo, la escritura personalizada y las interfaces son componentes principales, junto con mejores herramientas para aumentar la productividad.

¿Por qué molestarse en cambiar?

La perspectiva de cambiar de idioma en proyectos importantes puede ser estresante. Afortunadamente para cualquiera que esté considerando la tarea, el proceso de migrar un proyecto de JavaScript a TypeScript es bastante simple.

JavaScript ha pasado los últimos años ganando terreno como uno de los principales lenguajes de programación. Originalmente utilizado solo para secuencias de comandos front-end en sitios web, el lanzamiento de Node.js trajo el lado del servidor de JavaScript, lo que ayudó a expandir su popularidad.

Si bien JavaScript se ha vuelto mucho más popular recientemente, hay muchas funciones de las que aún carece su última implementación, ES6. Para muchos desarrolladores, estas funciones que faltan limitan la utilidad de JavaScript como lenguaje.

TypeScript tiene como objetivo rectificar esas preocupaciones al envolver JavaScript con funciones adicionales y luego transpilar el código del usuario. El resultado es un lenguaje de tipo seguro con la facilidad y facilidad de uso de JavaScript.

Ya existen varias herramientas y marcos con soporte completo de TypeScript. Angular lo ha estado usando durante mucho tiempo, e incluso React tiene formas de implementar TypeScript.

TypeScript es como JavaScript mejorado

TypeScript implementa muchas de las funciones que los desarrolladores suelen solicitar en JavaScript. TypeScript se llama así por el sistema de tipos completo que implementa, incluidas funciones como verificación de tipos, seguridad y escritura implícita. TypeScript incluso te permite definir y usar espacios de nombres personalizados.

TypeScript también contiene interfaces, enumeraciones e inferencia de tipos. TypeScript mantiene la compatibilidad con las funciones de la última implementación de JavaScript junto con las funciones heredadas y agrega un conjunto de funciones nuevas.

En general, el enfoque de TypeScript es crear un proceso de desarrollo más seguro con herramientas más sólidas para ayudar a los programadores.

Fomenta el código de tipo seguro

TypeScript utiliza un sistema integrado de verificación de tipos para validar los tipos de variables. Incluye un conjunto de tipos estándar con la opción de definir sus propias clases y tipos. Los tipos pueden declararse explícitamente o inferirse en función de la asignación.

TypeScript tiene varios tipos de datos estándar, incluidas cadenas, números, booleanos y tuplas. También están los tipos de variables, como unknown y any, que le permiten usar código débilmente tipeado.

La inferencia de tipos de TypeScript le permite ejecutar comprobaciones de tipos incluso en código JavaScript estándar ejecutándolo a través del transpilador de TypeScript.

La transpilación hace que sea fácil de usar

Desde la perspectiva del desarrollador, una de las mejores características de TypeScript es que genera JavaScript estándar. Puede ejecutar código TypeScript a través de un proceso conocido como transpilación, que es similar a la compilación.

Más que un ejecutable, el resultado de la transpilación es un script en un idioma diferente al original del código.

El código TypeScript se transpila a JavaScript, que luego puede ejecutar en un servidor o cliente. Esto le permite escribir código rápida y fácilmente que puede ejecutar en casi cualquier plataforma.

TypeScript ayuda a la productividad del desarrollador

Agregar tipos a JavaScript no solo permite que el código se ejecute de manera segura, sino que también brinda a los desarrolladores herramientas que facilitan la codificación. La mayoría de los IDE modernos ofrecen compatibilidad con TypeScript que permite que las herramientas de finalización de código, como IntelliSense, ofrezcan contexto adicional al código. También puede ofrecer verificación de tipo a medida que escribe, lo que lo ayuda a detectar errores más rápidamente.

Además, las estructuras de datos adicionales y la sintaxis de TypeScript están diseñadas para aumentar la legibilidad del código. Estas características hacen que sea más rápido y fácil crear código de alta calidad y detectar problemas potenciales antes de que se vuelvan problemáticos.

¿Cómo puedes portar tu código?

Si estás iniciando un nuevo proyecto, creando un nuevo proyecto TypeScript es bastante simple Sin embargo, convertir un proyecto preexistente a TypeScript es un poco más complicado.

En la mayoría de las circunstancias normales, la perspectiva de convertir un proyecto de un idioma a otro es aterradora. Sin embargo, la conversión de JavaScript a TypeScript es sorprendentemente simple.

TypeScript como un superconjunto de JavaScript

TypeScript se considera un superconjunto de JavaScript. Eso significa que TypeScript agrega capas adicionales de sintaxis y funcionalidad, sin cambiar ni eliminar la funcionalidad central en la que se basa.

Para los desarrolladores, esto significa que cualquier código que se ejecute correctamente en JavaScript se ejecutará automáticamente en TypeScript. Ya sea que el script en cuestión sea un servidor web escrito para ejecutarse en NodeJS, o un conjunto de scripts front-end para una página web, el cambio es excepcionalmente simple.

Después de instalar el transpiler de TypeScript, puede crear un sencillo tsconfig.json archivo con el siguiente contenido:

{
"opciones del compilador": {
"outDir": "./construir",
"permitirJs": verdadero,
"objetivo": "es5"
 },
"incluir": ["./origen/**/*"]
}

Mueva los archivos correspondientes al directorio src y ejecute el transpiler. Esto creará los archivos JavaScript resultantes en el construir directorio.

Estos cambios rápidos y sencillos convertirán un proyecto de JavaScript estándar en uno de TypeScript. Desde aquí, puede usar las nuevas funciones que ofrece TypeScript en su tiempo libre. Puede anotar tipos en variables, implementar tipos personalizados y definir interfaces.

Después de cada transpilación, puede utilizar la salida de la construir según sea necesario agregando los archivos a cualquier proyecto como lo haría normalmente. El transpiler verificará el tipo de JavaScript estándar y convertirá las nuevas funciones en scripts ES5 válidos.

Lo que necesita saber para pasar de JS a TS

El proceso de convertir un proyecto de JavaScript a TypeScript es excepcionalmente fácil. La conversión es tan simple como cambiar la estructura del directorio, agregar un archivo de configuración e instalar el transpiler.

Sin embargo, obtener todos los beneficios del nuevo idioma puede ser un proyecto mucho más largo. Si bien TypeScript puede inferir el tipo de cada variable en un proyecto, estas deben declararse explícitamente. Volver atrás y agregar tipos personalizados a un proyecto, agregar anotaciones adecuadas y crear interfaces puede llevar mucho tiempo.

Sin embargo, agregar estas funciones a un proyecto le permitirá obtener los beneficios que se obtienen con la verificación de tipos adecuada y las herramientas ampliadas. Los proyectos principales serán más rápidos y fáciles de construir, identificará los errores antes y los nuevos desarrolladores tendrán más facilidad para leer su código.