TypeScript es un lenguaje de programación de alto nivel que implementa muchos de los mecanismos más habituales de la programación orientada a objetos, pudiendo extraer grandes beneficios que serán especialmente deseables en aplicaciones grandes, capaces de escalar correctamente durante todo su tiempo de mantenimiento.

La característica fundamental de TypeScript es que compila en Javascript nativo, por lo que se puede usar en todo proyecto donde se esté usando Javascript. Dicho con otras palabras, cuando se usa TypeScript en algún momento se realiza su compilación, convirtiendo su código a Javascript común. El navegador, o cualquier otra plataforma donde se ejecuta Javascript, nunca llegará a enterarse que el código original estaba escrito en TypeScript, porque lo único que llegará a ejecutar es el Javascript resultante de la compilación.

En resumen, TypeScript es lo que se conoce como un "superset" de Javascript, aportando herramientas avanzadas para la programación que traen grandes beneficios a los proyectos.

Qué es un Superset

Es un lenguaje escrito encima de otro lenguaje o mejor dicho, que compila a otro lenguaje. En el caso de TypeScript es un lenguaje que compila a JavaScript, pero que incluye muchas facilidades y ventajas.

Los lenguajes como JavaScript basados en un estándar evolucionan muchas veces más lento que las necesidades de los desarrolladores. Entonces surgen empresas o comunidades que deciden expandir un lenguaje, aportando todas las herramientas que se echan en falta para poder desarrollar con las mejores condiciones.

Los superset compilan en el lenguaje estándar, por lo que el desarrollador programa en aquel lenguaje expandido, pero luego su código es "transpilado" para transformarlo en el lenguaje estándar, capaz de ser entendido en todas las plataformas.

Existen dos superset populares para Javascript. Por un lado tenemos CoffeeScript y por otro lado TypeScript. La diferencia principal es que mientras que CoffeeScript te aleja del lenguaje, con TypeScript escribes en un lenguaje que es muy similar al propio Javascript. Por ese motivo los programadores interesados en usar un superset se han volcado principalmente a TypeScript.

De todos modos, existen personas a favor y en contra de los superset, por varios motivos. Pero en este caso usar TypeScript no tiene una desventaja particular, ya que si queremos aprovechar las ventajas de Javascript tendremos que decantarnos por el uso de ES6, lo que nos obligará a usar un transpilador como Babel. Al final, desarrollar en TypeScript o en el propio JavaScript con ES6 hace muy poca diferencia en la práctica, puesto que las dos alternativas te obligarán a usar un transpilador. En resumen, en el caso de usar ES6 necesitas de Babel, u otro transpilador, y en el caso programar en TypeScript usarás el propio transpilador de TypeScript (sigue leyendo para mayores aclaraciones).

Por qué TypeScript

En concreto TypeScript nos ofrece muchas de las utilidades que se necesitan en JavaScript para poder convertirlo en un lenguaje escalable, a la altura de las necesidades más exigentes. TypeScript nos ofrece muchas de las cosas que los desarrolladores de lenguajes más tradicionales vienen usando en su día a día.

Una de las diferencias fundamentales es que TypeScript es verdaderamente orientado a objetos, trayendo herramientas como la herencia, sobrecarga, etc. En resumen tiene cosas que suenan a lenguajes como Java, C++, C#, etc. Otro ejemplo clave es el del tipado estático. En el caso de TypeScript este tipado estático es opcional, pero obviamente su uso es muy recomendado y es una de las principales utilidades que nos van a facilitar mucho el trabajo y la depuración de los programas.

Cuando trabajamos con TypeScript tenemos a nuestra disposición todas las herramientas de Javascript ES6 (EcmaScript 6) y muchas de las que encontraremos en la futura especificación ES7. Por lo tanto, usar TypeScript te asegura que podrás adelantarte al futuro y empezar a usar las posibilidades de estos estándares en el presente.

Además, TypeScript es la opción más natural de entrar en Angular 2, la nueva versión del más popular de los frameworks JavaScript. Si trabajas o vas a trabajar con Angular 2 apreciarás dominar TypeScript, por varios motivos que explicaremos. Entre ellos porque la mayor parte de la documentación la encontrarás con este lenguaje y porque te ofrece las mejores herramientas para combinar con el estilo de desarrollo promovido por Angular 2.

Qué necesitamos para usar TypeScript

Básicamente necesitamos descargar dos programas. El primero es NodeJS, no porque necesitemos desarrollar con Node, sino porque el compilador de TypeScript está desarrollado en NodeJS.

Desde el sitio de NodeJS encontramos las opciones para la instalación en nuestro sistema operativo, por medio de un típico instalador con su asistente (siguiente, siguiente…) Más información en el Manual de NodeJS.

Luego necesitarás el TSC (Command-line TypeScript Compiler), la herramienta que nos permite compilar un archivo TypeScript a Javascript nativo. Este software es el que está realizado con NodeJS y su instalación se realiza vía npm con el siguiente comando:

npm install -g typescript

Cómo crear y compilar un archivo TypeScript

El archivo TypeScript lo creas con cualquier editor de texto para programadores, como habitualmente haces con cualquier otro lenguaje. Solo que generalmente usarás la extensión ".ts".

Algo muy importante: Cualquier código Javascript compila en TypeScript. Esto quiere decir que el código que tenemos en Javascript lo podemos usar también perfectamente dentro de Javascript. Por tanto, para trabajar con TS podemos usar perfectamente los conocimientos que tenemos en Javascript, agregando diversas ayudas que nos ofrece TypeScript.

Este sería un posible código TypeScript donde hemos colocado básicamente unos cuantas declaraciones de tipos en variables. Además de una función que se ha declarado devuelve "void" (nada).

var a:number = 9;
a += 4;

function mostrar(b:string) :void{
  console.log(b);
}
mostrar('hola');

Para compilarlo usarás el mencionado TSC y lanzarás un sencillo comando que convertirá el código a Javascript nativo.

tsc ejemplo.ts

La herramienta TSC incluye además "watchers" que permiten vigilar cambios en los archivos TS, compilando su código a JS en el instante sin que tengamos que intervenir. Además es habitual que el compilador, se use en conjunto con otras herramientas como Gulp para mejorar aún más el flujo de desarrollo.

Existe asimismo un archivo de configuración llamado "tsconfig.json" en el que podemos indicar todas las opciones que queramos para el compilador (por ejemplo el estándar EcmaScript al que deseamos compilar el código, el tipo de reporte de errores que se desea, las rutas donde colocar los archivos compilados, etc).

Editores y TypeScript

Una de las cosas que debemos de conseguir cuando vamos a programar con TypeScript es un editor que lo soporte. El motivo es que los editores son capaces de compilar el código TypeScript a la vez que se está escribiendo, informando de errores en el código en el instante de su creación, lo que ahorra mucho tiempo y facilita el flujo de desarrollo.

Te informará de asuntos como:

• Una variable con tipado estático a la que se le intenta cargar un dato de otro tipo
• Una función que devuelve un valor de un tipo distinto al que debería
• Una función a la que no se le están pasando los valores de tipos correctos, o los objetos de clases correctas
• Un objeto sobre el que se intentan invocar métodos privados
• Y la lista no para de crecer…

Además, al tipar las variables seremos capaces de obtener muchas más ayudas "intellisense", como métodos invocables sobre cadenas o números, métodos que contiene un objeto, etc.

Existen editores que ya incorporan las ayudas para la programación en TypeScript, como Visual Studio o Visual Studio Code (Este último un editor ligero y gratuito para cualquier uso). Otros editores como Vim, Atom, Sublime Text o Brackets necesitarán la instalación de plugins especiales para poder aportar todas las ayudas de TypeScript.

TypeScript Playground

Un sitio interesante para probar TypeScript sin necesidad de instalar nada, o para revisar rápidamente cómo un código TS compilaría a Javascript, es el TypeScript Playground.

Encontrarás dos cajas de texto, en la primera escribes código TypeScript y en tiempo real verás cómo este código compila a Javascript en la caja de la derecha. Además encontrarás ayudas en la caja de la izquierda, donde escribes TS, indicando en qué partes de tu código se encuentran problemas y sus motivos.

Esta es una herramienta muy útil tanto para aprender TypeScript como para probar puntualmente un código que os recomendamos experimentar ya mismo. Tiene un desplegable muy útil porque ya te muestra varios ejemplos de código ya escritos, si es que quieres ver cómo funciona el compilador sin tener ni idea de cómo se escribe en TS.

Vídeo de presentación de TypeScript

Para acabar os ofrecemos a continuación el vídeo de presentación de TypeScript, que grabamos con motivo del inicio del Curso de TypeScript en EscuelaIT. En esta clase online tuvimos a nuestros profesores del curso, que nos explicaron para qué sirve TypeScript y nos realizaron unas cuantas demostraciones de su uso, capaces de aclarar dudas y facilitar los primeros pasos.