Tutorial de TypeScript
TypeScript es un superconjunto de JavaScript que admite el estándar ECMAScript 6 (Tutorial de ES6）。
TypeScript es un lenguaje de programación libre y de código abierto desarrollado por Microsoft; es un superconjunto que añade comprobación de tipos estática sobre JavaScript.
TypeScript tiene como objetivo el desarrollo de aplicaciones a gran escala. Puede compilarse a JavaScript puro, y el JavaScript resultante puede ejecutarse en cualquier navegador.
¿Por qué elegir TypeScript?
TypeScript es un lenguaje de programación de código abierto desarrollado por Microsoft; es un superconjunto de JavaScript.
TypeScript mejora enormemente la experiencia de desarrollo de JavaScript al añadir características como tipos estáticos opcionales, interfaces y enumeraciones.
Principales ventajas de TypeScript
- Comprobación de tipos estáticos:Detecta errores de tipo en tiempo de compilación y reduce errores en tiempo de ejecución.
- Potente soporte de IDE:Autocompletado inteligente de código, navegación y refactorización.
- Mejor legibilidad del código:Los tipos en sí mismos son la mejor documentación.
- Características modernas de JavaScript:Admite sintaxis ES6+, como funciones flecha, módulos, clases, etc.
- Migración progresiva:Puede migrar gradualmente proyectos JavaScript existentes a TypeScript.
Cómo funciona TypeScript
TypeScript no puede ejecutarse directamente en el navegador; primero debe compilarse a JavaScript. Este proceso de compilación verifica errores de tipo y convierte la sintaxis específica de TypeScript en JavaScript puro.
Diagrama SVG: proceso de compilación de TypeScriptEl compilador de TypeScript (tsc) realiza la comprobación de tipos durante la compilación; si encuentra errores de tipo, informa del error y detiene la compilación. Tras una compilación exitosa, genera código JavaScript puro que puede ejecutarse en cualquier navegador o entorno Node.js.
Características del lenguaje
TypeScript es una extensión de JavaScript mejorada en tipos; manteniendo la compatibilidad con la sintaxis original, introduce un sistema de tipos más potente y capacidades de ingeniería.
Capacidades de mejora principales (exclusivas de TypeScript)
| Característica | Descripción |
|---|---|
| Anotaciones de tipo y comprobación en tiempo de compilación | Detecta errores de tipo en la fase de desarrollo y mejora la fiabilidad del código. |
| Inferencia de tipos | No es necesario declarar tipos explícitamente; el compilador puede inferirlos automáticamente. |
| Borrado de tipos | Después de la compilación, elimina la información de tipos y genera JavaScript puro. |
| Interfaces (Interface) | Se utilizan para definir la estructura de objetos y reforzar las restricciones del código. |
| Enumeraciones (Enum) | Proporcionan un conjunto de constantes con nombre, mejorando la legibilidad. |
| Genéricos (Generics) | Admiten la reutilización de tipos y aumentan la flexibilidad de funciones y clases. |
| Mixin | Implementan el patrón de composición para herencia múltiple. |
| Espacios de nombres (Namespace) | Organizan la estructura del código (método antiguo; actualmente se usan más los módulos). |
| Tuplas (Tuple) | Arreglos de longitud fija y con tipos diferentes. |
| Asincronía (Await) | Proporciona un control de flujo asíncrono más intuitivo. |
Soporte de sintaxis de ES2015 (compatibilidad hacia atrás)
TypeScript también admite y compila hacia abajo las características principales de ECMAScript 2015:
| Característica | Descripción |
|---|---|
| Clases (Class) | Soporte de programación orientada a objetos. |
| Módulos (Module) | Admiten desarrollo modular (import/export). |
| Funciones flecha (=>) | Sintaxis de función más concisa, con enlace al ámbito léxico. |
| Parámetros opcionales | Los parámetros de una función pueden omitirse. |
| Parámetros por defecto | Proporcionan valores por defecto para los parámetros. |
Diferencia entre JavaScript y TypeScript
TypeScript es un superconjunto de JavaScript que extiende la sintaxis de JavaScript, por lo que el código JavaScript existente puede funcionar con TypeScript sin ninguna modificación. TypeScript proporciona comprobación estática de tipos en tiempo de compilación mediante anotaciones de tipo.
TypeScript puede manejar código JavaScript existente y solo compila el código TypeScript que contiene.
Primer ejemplo de TypeScript
En el siguiente ejemplo usamos TypeScript para mostrar: Hello World!:
Otras extensiones