1.1. ¿Qué es TypeScript y por qué usarlo?

TypeScript es un lenguaje de programación que extiende JavaScript añadiendo tipos estáticos. Fue desarrollado por Microsoft y se utiliza principalmente para escribir aplicaciones más grandes y escalables. Aunque el código TypeScript se compila a JavaScript para poder ejecutarse en cualquier navegador o entorno compatible con JavaScript, la principal ventaja es la detección temprana de errores gracias al tipado.

Beneficios de TypeScript:

• Tipado estático: Permite detectar errores durante la fase de desarrollo.
• Mejor autocompletado e inferencia de tipos: Proporciona sugerencias más precisas y detección de errores en los editores de código.
• Mantener y escalar proyectos: Ayuda a trabajar en proyectos grandes y en equipo, proporcionando un código más robusto y fácil de mantener.
• Compatibilidad con JavaScript: Puedes adoptar TypeScript gradualmente, ya que todo archivo JavaScript válido es también un archivo TypeScript válido.

1.2. Instalación y configuración del entorno

Para empezar a trabajar con TypeScript, sigue los siguientes pasos:

1. Instalar Node.js: TypeScript se puede instalar usando npm, que viene incluido con Node.js. Para verificar si ya tienes Node.js instalado:

    
   1node -v
   2npm -v
   Salida de Consola!:
   v15.10.0
   7.5.3

2. Instalar TypeScript: Ejecuta el siguiente comando para instalar TypeScript de forma global:

   1npm install -g typescript

   Verifica la instalación comprobando la versión de TypeScript:

   1tsc -v

3. Editor de código: Se recomienda usar Visual Studio Code o cualquier editor compatible con TypeScript para aprovechar características como autocompletado, análisis de errores y navegación por el código.

1.3. Configuración de tsconfig.json

El archivo tsconfig.json es la configuración central de TypeScript en un proyecto. Este archivo define cómo el compilador tsc debe comportarse, qué archivos debe compilar, y varias otras opciones importantes.

Para generar un archivo tsconfig.json en tu proyecto:

1tsc --init

Este comando crea un archivo tsconfig.json con una configuración básica. A continuación, se muestran algunas de las configuraciones más importantes:

• target: Define a qué versión de JavaScript se compilará tu código. Ejemplo:

  1"target": "ES6"

• module: Especifica el sistema de módulos a usar. Ejemplo:

  1"module": "commonjs"

• strict: Habilita un conjunto de verificaciones estrictas para garantizar un código más seguro y robusto. Se recomienda tenerlo activado:

  1"strict": true

• outDir: Directorio donde se colocarán los archivos JavaScript compilados:

  1"outDir": "./dist"

1.4. TypeScript vs JavaScript: Principales diferencias

Aunque TypeScript es un superconjunto de JavaScript, existen algunas diferencias clave:

1. Tipado estático: En JavaScript no es obligatorio declarar tipos. En TypeScript, puedes especificar los tipos de las variables, funciones y objetos, lo que permite detectar errores de tipado en tiempo de desarrollo.

   • JavaScript:

      
     1let nombre = "Juan";
     2console.log(nombre);
     Salida de Consola!:
     Juan

   • TypeScript:

      
     1let nombre: string = "Juan";
     2console.log(nombre);
     Salida de Consola!:
     Juan

2. Interfaces y Tipos: TypeScript permite definir contratos claros para objetos mediante interfaces y tipos, mejorando la legibilidad y mantenimiento del código.

   • TypeScript:

      
     1interface Persona {
     2  nombre: string;
     3  edad: number;
     4}
     5
     6const persona: Persona = { nombre: "Juan", edad: 25 };
     7console.log(persona);
     Salida de Consola!:
     { nombre: 'Juan', edad: 25 }

3. Decoradores y clases: TypeScript extiende la funcionalidad de las clases de JavaScript, añadiendo soporte para características como los decoradores.

4. Soporte para módulos ES6 y más allá: Mientras que JavaScript admite módulos, TypeScript agrega una mejor estructura y soporte para sistemas de módulos más avanzados como CommonJS y ESModules.

5. Compilación: El código TypeScript necesita ser compilado a JavaScript antes de ejecutarse en el navegador o servidor. JavaScript no requiere una fase de compilación adicional.

1.5. Primer programa en TypeScript

Ahora que tenemos el entorno configurado, es hora de escribir nuestro primer programa en TypeScript.

1. Crea un archivo llamado index.ts:

    
   1// index.ts
   2let saludo: string = "¡Hola, TypeScript!";
   3console.log(saludo);
   Salida de Consola!:
   ¡Hola, TypeScript!

2. Compila el archivo TypeScript a JavaScript:

   1tsc index.ts

   Esto generará un archivo index.js que contiene el código JavaScript resultante:

    
   1// index.js
   2var saludo = "¡Hola, TypeScript!";
   3console.log(saludo);
   Salida de Consola!:
   ¡Hola, TypeScript!

3. Ejecuta el archivo JavaScript:

   1node index.js

   El resultado será:

   ¡Hola, TypeScript!

Este primer programa muestra cómo usar tipado estático y cómo compilar TypeScript a JavaScript para ejecutarlo en Node.js o en un navegador.

---

Este módulo sienta las bases para entender qué es TypeScript, cómo configurarlo y empezar a trabajar con él.