Introducción a TypeScript

TypeScript es un lenguaje de programación orientado a objetos de código abierto desarrollado y mantenido por Microsoft Corporation. TypeScript es un lenguaje fuertemente tipado y su primera versión se presentó en 2012. Es un superconjunto estricto de JavaScript, lo que significa que cualquier cosa que se implemente en JavaScript se puede implementar usando TypeScript junto con la opción de agregar funciones mejoradas (cada Código JavaScript existente es un código TypeScript válido). Como el código TypeScript se convierte en código JavaScript, facilita la integración en proyectos JavaScript. Está diseñado principalmente para proyectos de gran escala.

TypeScript ===>>> JavaScript + Tipo + Algunas funciones adicionales

¿Qué ofrece TypeScript?

1. Verificación de tipo estático (opcional): al igual que otros lenguajes de programación de alto nivel como Java, C, etc., TypeScript proporciona verificación de tipo estático a diferencia de JavaScript. Aunque la escritura estática requiere algunos pasos adicionales al escribir código, tiene sus propias ventajas. Con TypeScript podemos comprobar y asignar variables, parámetros y tipos de funciones. Es completamente opcional y nos ayuda a encontrar y prevenir errores. También ayuda a que el código sea más legible y descriptivo.
2. Objetos basados ​​en clases: otra gran ventaja es el uso de clases, que brinda la capacidad de usar una verdadera programación orientada a objetos en nuestras aplicaciones y evita el uso de objetos basados ​​en prototipos. También proporciona encapsulación, herencia y modificadores.
3. Modularidad: ayuda a que el código sea más modular.
4. Funciones de ES6: la compatibilidad con las funciones de ES6 también es una de las principales razones de su popularidad.
5. Sintaxis: TypeScript proporciona una sintaxis más cercana a Java y otros lenguajes de alto nivel (Syntactical Sugaring).

El navegador no puede interpretar el código TypeScript directamente, por lo que es necesario compilar el código TypeScript en un código JavaScript simple, para este propósito necesitamos el compilador TypeScript (tsc).

Compilador de TypeScript (tsc)

• Escrito en el propio TypeScript.
• Compila archivos .ts en archivos .js.
• Instalado como un paquete NPM (NodeJS).
• Soporta sintaxis ES6.

¿Por qué TypeScript está ganando popularidad?

• JavaScript se desarrolló inicialmente para ser un lenguaje liviano y fácil de aprender que se enfoca principalmente en manipulaciones DOM simples, pero los estándares cambiaron con el tiempo y ahí es donde apareció TypeScript, ya que agrega características mejoradas a JavaScript.
• La compatibilidad con clases y objetos también es una de las principales razones de su creciente popularidad, ya que facilita la comprensión y la implementación de los conceptos de OOPS en comparación con la implementación estándar basada en prototipos proporcionada por JavaScript nativo.
• Además, el uso de TypeScript en marcos de JavaScript populares como Angular ha ayudado a que TypeScript gane interés.

¿Por qué usamos TypeScript?

1. Mejor experiencia de desarrollador: una de las mayores ventajas de TypeScript es permitir que los IDE brinden un entorno más rico para detectar errores comunes a medida que escribe el código. Para un proyecto a gran escala, la adopción de TypeScript podría dar como resultado un software más sólido, al mismo tiempo que se puede implementar donde se ejecutaría una aplicación JavaScript normal.
2. Calidad del código: definir estructuras de datos desde el principio, utilizando tipos e interfaces, lo obliga a pensar en la estructura de datos de su aplicación desde el principio y tomar mejores decisiones de diseño.
3. Previene errores: TypeScript no hará que su software esté libre de errores. Pero puede prevenir muchos errores relacionados con el tipo. Junto con Clever IntelliSense, muchos navegadores e IDE admiten la depuración directa a través de Source Maps.
4. Comunidad activa: TypeScript se está volviendo cada vez más popular. Lo utilizan las principales empresas tecnológicas como Google, Airbnb, Shopify, Asana, Adobe y Mozilla, por lo que podemos suponer que cumple sus expectativas en términos de escalabilidad, ya que están desarrollando aplicaciones grandes y complejas.
5. TypeScript es solo JavaScript: TypeScript comienza con JavaScript y termina con JavaScript. Typescript adopta los componentes básicos de su programa de JavaScript. Todo el código de TypeScript se convierte en su equivalente de JavaScript con el fin de ejecutarlo.

“A menudo, la forma en que se termina adoptando TypeScript (en empresas, nuevas empresas y desarrolladores individuales) es que lo pruebas en un proyecto y dices ‘¡guau, esto es genial!’ y luego empiezas a evangelizar y crece localmente en tu esfera de influencia”. — Anders Hejlsberg (desarrollador principal de TypeScript).

Ejemplo:

<!DOCTYPE html>
<html>
  
<body>
    <h2>Welcome To GFG</h2>
  
    <p>
        Default code has been 
        loaded into the Editor.
    </p>
  
    <script src="types.js"></script>
</body>
  
</html>

let myString: string;
  
myString = 'Hello from ts'
  
console.log(myString);

Después de guardar los archivos anteriores, necesitamos transpilar el código TypeScript . 

En la terminal, escribe el siguiente comando:

tsc types.js (syntax : tsc filename). 

En una compilación exitosa, se creará un archivo JavaScript con el mismo nombre y extensión .js , es decir , types.js que contiene el código transpilado en el mismo directorio. Ahora, al ejecutar index.html, se puede ver el siguiente resultado. Como se discutió anteriormente, el código TypeScript se transpila en código JavaScript estándar.

Código JavaScript generado en el archivo type.js:

var myString;
myString = 'Hello from ts';
console.log(myString);

Producción: