Ahí vamos a hacer un programa sencillito en TypeScript
. Recuerda, que al final lo que hacemos es transformar nuestro código a JavaScript
. Esto es lo que se conoce como transpilar. Como verás, prácticamente no hay mucha diferencia entre el TypeScript
y el JavaScript
. Conforme avancemos y profundicemos en TypeScript
, seguro que seremos capaces de observar claras diferencias, sin embargo, inicialmente no hay mucha diferencia. En este primer ejemplo, vamos a crear una simple función que sea capaz de sumar dos números. Si no conoces que es una variable, o una función, no te preocupes, porque lo veremos en los siguientes capítulos. Ahora, lo importante es que te quedes con el flujo de trabajo, y veas lo sencillo que es hacer mi primer programa en TypeScript.
Mi primer programa
Para este primer programa vamos a hacer algo realmente sencillo, una función que sume dos cantidades. Nada mas que eso, algo tan sencillo y con tan poca utilidad. Sin embargo, nos va a servir, para ver como funciona todos los preparativos que hemos ido haciendo hasta llegar aquí.
La función
Dentro del directorio src
, tienes que crear un archivo app.ts
, con el siguiente contenido,
/**
* @param a - un número
* @param b - otro número
* @returns la suma de los dos números
*/
function suma(a: number, b: number): number{
return a + b;
}
const a = 5;
const b = 6;
/** la suma */
const total = suma(a, b);
console.log(`la suma de ${a} y ${b} es ${total}`);
function
nos permite definir la función que queremos. Esta función que se llamasuma
, tiene dos parámetrosa
yb
. Que son del tiponumber
. Y además nos devuelve el resultado que también es del tiponumber
.const
sirve en este caso para definir una constante.console.log
te permitirá mostrar un resultado. En este caso, utilizando el tipo de comillas que ves en el ejemplo, puedes incluir las constantes que has definido anteriormente, incluso el valor del resultado. Esto, lo haces utilizando${variable}
.
Documentación
Además de definir la función, hemos aprovechado para crear la documentación de la función, indicando que es cada uno de los parámetros que le pasamos, así como el valor que nos devuelve.
Para la documentación se sigue la sintaxis de TSDoc. Y en mi caso, estoy utilizando el plugin Neogen
, que es el que se encarga de generar la plantilla para completar la documentación de la función.
Transpilando
El siguiente paso es transpilar y ejecutar la aplicación. En la parte de la transpilación, simplemente transformamos nuestro código de TypeScript
a JavaScript
, tal y como puedes ver a continuación,
"use strict";
/**
* @param a - un número
* @param b - otro número
* @returns la suma de los dos números
*/
function suma(a, b) {
return a + b;
}
/** una variable */
const a = 5;
const b = 6;
/** la suma */
const total = suma(a, b);
console.log(`la suma de ${a} y ${b} es ${total}`);
Este archivo, resultado de la transpilación, lo puedes encontrar en el directorio ./build
. En concreto, ./build/app.js
.
Como puedes observar, no hay mucha diferencia entre el resultado de la transpilación y la aplicación original. Mas bien, en este caso, se ha quitado el tipado de las variables y listo.
Ejecutando la aplicación
Para ejecutar tu primera aplicación, tan solo tienes que lanzar el siguiente comando en la terminal,
node build/app.js
Y el resultado que te arrojará es el previsible,
la suma de 5 y 6 es 11
El vídeo
Lo mismo que te he contado hasta aquí, pero en formato vídeo,
Conclusión
Ya tienes tu primera aplicación implementada en TypeScript y transpilada a JavaScript. Has podido ver que es realmente muy sencillo, y que lo único que tenemos que hacer, a partir de ahora, es ir profundizando en los distintos conceptos, y conociendo este lenguaje de programación.
Más información,