Fundamentos y claves de TypeScript
¿Por qué usar TypeScript?
TypeScript puede prevenir hasta un 15% de fallas en los proyectos. TypeScript cuenta con un analizador de código estáticos que constantemente nos está indicando posibles fallas o maneras para mejorar tu código.
Según Octoverse 2021, una encuesta que realiza Github a sus desarrolladores en la que mide la percepción de varios lenguajes, TypeScript ha tenido una aceptación creciente desde el 2017 hasta la actualidad.
También NPM trends nos dice que TypeScript está siendo demasiado usado por muchas librerías y proyectos en todo el ecosistema JavaScript. Pero, ¿entonces TypeScript es diferente a JavaScript? ¿Un desarrollador en TypeScript es diferente a uno en JavaScript?
La respuesta a ambas es sí, sin embargo, no hay una diferencia notable. Uno (TypeScript) se basa en el otro (JavaScript) añadiendo elementos para mejorar la detección de bugs y experiencia de desarrollo.
En JavaScript solo te das cuenta de que tienes un error hasta el momento en que lo ejecutas, sea en el navegador o en un entorno de ejecución como NodeJS, más no antes. Lo que queremos como desarrolladores es obtener retroalimentación lo antes posible para tener la menor cantidad de errores en producción.
En el libro de Software Engineering At Google se muestra ciertas capas para detectar fallas en el desarrollo de software:
- El análisis de código estático: es una herramienta que escanea el código en busca de errores y vulnerabilidades comunes.
- Pruebas Unitarias: se elaboran pruebas para verificar el comportamiento de las unidades pequeñas de una parte del código.
- Pruebas de Integración: se realiza una análisis de los procesos relacionados con el ensamblaje o unión de los componentes.
- Revisión de código: se verifica si se ha seguido con las normas, estándares y mejores prácticas establecidas por el equipo.
¿Cómo instalamos TypeScript?
Normalmente TypeScript se instala por cada proyecto o dependiendo de como lo quieras usar, (Lo recomendable es que se instale por proyecto).
- Creamos una carpeta para nuestro proyecto.
2. Abrimos nuestro editor de preferencia. Si usas Visual Studio Code:
3. Ahora crearemos nuestro archivo package.json de manera simple desde la terminal y dentro de la ruta de nuestro proyecto:
4. Finalmente, instalamos TypeScript.
Compilador de Typescript
Lo que realmente hace el compilador es transpilar, ni el navegador ni Node.js pueden leer nativamente archivos de TypeScript, por lo que se realiza un proceso de traducción en la que el código lo convierte a JavaScript.
Compilación de archivos TypeScript
Para realizar el proceso de transpilación en Nodejs, ejecutamos lo siguiente en terminal:
Compilación a una versión específica
Podemos hacer que un archivo de TypeScript sea transpilado a JavaScript en un estándar específico como ECMAScript 6.
Enviar compilación a una carpeta en especifico
Si deseas que los archivos ya transpilados se generen en otra carpeta, puedes hacer agregar esta configuración al compilador:
¿Qué es el tipado en TypeScript?
Gracias a TypeScript podemos manejar el tipado de las variables para evitar anomalías en el código.
En JavaScript, para declarar una variable constante lo realizamos de esta manera, para proyectos de software que tienen una gran escalabilidad, esto podría ser una fuente de bugs en el programa:
En TypeScript es similar al caso anterior, excepto que agregamos : y el tipo de datos de la variable, que será número. Estas últimas se denominan anotaciones de tipo o anotaciones de tipo:
Inferencia de tipos
A partir de la inicialización de una variable TypeScript, infiere el tipo que se utilizará en todo el código y no se puede cambiar. Por ejemplo:
Aunque no indicamos el tipo de dato, qué pasaría en este caso:
En Visual Studio Code, puede obtener el autocompletado proporcionando sugerencias basadas en el tipo de datos de una variable:
Aunque en archivos diferentes, TypeScript indicará aquellas variables con el mismo nombre como errores. Esto no sucede en entornos preconfigurados como Angular o React porque funcionan de manera modular o cada variable tiene un alcance. Si desea utilizar el mismo nombre de variable en diferentes archivos, puede crear una función anónima autoejecutable:
Tipos de datos
- Numbers: El tipo de dato number se usa para variables que contendrán números positivos, negativos o decimales.
- Booleanos: Este tipo de dato puede tomar dos valores: true o false.
- String: El tipo de dato string nos permite almacenar una cadena de texto.
- Array: TypeScript, de no indicarle explícitamente, va a inferir que este solo contendrá valores del tipo number, si se quiere agregar un valor string nos va a marcar error. Lo puedes definir de esta manera:
Indicar explícitamente el tipo o tipos de datos que va almacenar el array:
Tipos de datos especiales
- Any
Este tipo de datos es exclusivo de TypeScript. Literalmente nos permite almacenar cualquier tipo de dato en una variable(no se recomienda usar este tipo de datos ya que se considera como mala práctica):
Es importante mencionar que la utilidad de Any es cuando se requiere migrar poco a poco de TypeScript desde JavaScript, ya que se implementaria el tipo de dato donde sea necesario sin romper nuestra programa de golpe.
- Union Types
En este tipo de dato nos brinda definir más de un tipo de dato, igual en los argumentos de nuestra funciones.
¡Atrévete a probar TypeScript!
TypeScript es el mejor amigo en la hora de hacer proyectos con gran escalabilidad ya que es un lenguajes de programación libre y fuertemente tipado, que nos ayuda bastante con su análisis de código estático que nos libra de los dolores de cabeza a la hora de compilar, si no que en lo que vamos escribiendo código nos va corrigiendo los errores y dándonos sugerencias de cómo mejorarlo.
¿Quieres leer más temas similares? 👉Visita el blog de Nowports Tech👈
