¿Qué es Javascript?
JavaScript (también conocido como ECMAScript) comenzó su vida como un lenguaje de programación
simple para navegadores. En el momento en que se inventó, se esperaba que se usara para pequeños
fragmentos de código incrustados en una página web; escribir más de unas pocas docenas de líneas
de código habría sido algo inusual. Debido a esto, los primeros navegadores web ejecutaban dicho
código con bastante lentitud. Sin embargo, con el tiempo, JS se hizo cada vez más popular y los
desarrolladores web comenzaron a usarlo para crear experiencias interactivas.
Los desarrolladores de navegadores web respondieron a este mayor uso de JS optimizando sus
motores de ejecución (compilación dinámica) y ampliando lo que se podía hacer con ellos
(agregando API), lo que a su vez hizo que los desarrolladores web lo usaran aún más. En los
sitios web modernos, su navegador ejecuta con frecuencia aplicaciones que abarcan cientos de
miles de líneas de código. Se trata de un crecimiento prolongado y gradual de "la web", que
comienza como una simple red de páginas estáticas y evoluciona hacia una plataforma para
aplicaciones ricas de todo tipo.
Más que esto, JS se ha vuelto lo suficientemente popular como para usarse fuera del contexto de
los navegadores, como la implementación de servidores JS usando node.js. La naturaleza de
"ejecutar en cualquier lugar" de JS lo convierte en una opción atractiva para el desarrollo
multiplataforma. ¡Hay muchos desarrolladores en estos días que usan solo JavaScript para
programar toda su pila!
En resumen, tenemos un lenguaje que fue diseñado para usos rápidos y luego se convirtió en una
herramienta completa para escribir aplicaciones con millones de líneas. Cada idioma tiene sus
propias peculiaridades : rarezas y sorpresas, y el humilde comienzo de JavaScript hace que tenga
muchas de ellas. Algunos ejemplos:
- El operador de igualdad de JAvaScript ( = = ) coaaciona sus argumentos,
lo que lleva aun comportamiento inesperado:
if ("" == 0) {
// It is! But why??
}
if (1 < x < 3) {
// True for *any* value of x!
}
- JavaScript también permite acceder a propiedades que no están presentes:
const obj = { width: 10, height: 15 };
// Why is this NaN? Spelling is hard!
const area = obj.width * obj.heigth;
La mayoría de los lenguajes de programación arrojarían un error cuando ocurren este tipo de
errores, algunos lo harían durante la compilación, antes de que se ejecute cualquier código. Al
escribir programas pequeños, estas peculiaridades son molestas pero manejables; al escribir
aplicaciones con cientos o miles de líneas de código, estas constantes sorpresas son un problema
grave.
Un verificador de tipo estático
Dijimos anteriormente que algunos lenguajes no permitirían que esos programas con errores se
ejecutaran en absoluto. La detección de errores en el código sin ejecutarlo se conoce como
verificación estática . Determinar qué es un error y qué no se basa en los tipos de valores en
los que se opera se conoce como verificación de tipo estática .
TypeScript verifica un programa en busca de errores antes de la ejecución, y lo hace en función
de los tipos de valores , es un verificador de tipo estático . Por ejemplo, el último ejemplo
anterior tiene un error debido al tipo de obj. Aquí está el error que encontró TypeScript:
const obj = { width: 10, height: 15 };
const area = obj.width * obj.heigth;
Property 'heigth' does not exist on type '{ width: number; height: number; }'. Did you mean 'height'?
Un superconjunto scrito de JavaScript
Sin embargo, ¿cómo se relaciona TypeScript con JavaScript?
Sintaxis
TypeScript es un lenguaje que es un superconjunto de JavaScript: la sintaxis JS es, por lo
tanto, TS legal. La sintaxis se refiere a la forma en que escribimos texto para formar un
programa. Por ejemplo, este código tiene un error de sintaxis porque le falta un ):
let a = (4
')' expected.
TypeScript no considera que ningún código JavaScript sea un error debido a su sintaxis. Esto
significa que puede tomar cualquier código JavaScript que funcione y colocarlo en un archivo
TypeScript sin preocuparse por cómo está escrito exactamente.
Tipos
Sin embargo, TypeScript es un superconjunto escrito , lo que significa que agrega reglas sobre
cómo se pueden usar diferentes tipos de valores. El error anterior obj.heigthno fue un error de
sintaxis : es un error de usar algún tipo de valor (un tipo ) de manera incorrecta.
Como otro ejemplo, este es el código JavaScript que se puede ejecutar en el navegador, y se va a
registrar un valor de:
console.log(4 / []);.
Este programa sintácticamente legal registra Infinity. TypeScript, sin embargo, considera que la
división de números por una matriz es una operación sin sentido y generará un error:
console.log(4 / []);
The right-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.
Es posible que realmente qué va a dividir un número por una matriz, tal vez sólo para ver qué
pasa, pero la mayor parte del tiempo, sin embargo, esto es un error de programación. El
comprobador de tipos de TypeScript está diseñado para permitir el paso de programas correctos
sin dejar de detectar tantos errores comunes como sea posible. (Más adelante, aprenderemos sobre
las configuraciones que puede usar para configurar qué tan estrictamente TypeScript verifica su
código).
Si mueve algún código de un archivo JavaScript a un archivo TypeScript, es posible que vea
errores de tipo según cómo esté escrito el código. Estos pueden ser problemas legítimos con el
código o que TypeScript sea demasiado conservador. A lo largo de esta guía, demostraremos cómo
agregar varias sintaxis de TypeScript para eliminar tales errores.
Comportamiento en tiempo de ejecución
TypeScript también es un lenguaje de programación que conserva el comportamiento en tiempo de
ejecución de JavaScript. Por ejemplo, dividir por cero en JavaScript produce en Infinitylugar de
lanzar una excepción de tiempo de ejecución. Como principio, TypeScript nunca cambia el
comportamiento en tiempo de ejecución del código JavaScript.
Esto significa que si mueve código de JavaScript a TypeScript, se garantiza que se ejecutará de
la misma manera, incluso si TypeScript cree que el código tiene errores de tipo.
Mantener el mismo comportamiento en tiempo de ejecución que JavaScript es una promesa
fundamental de TypeScript porque significa que puede realizar una transición fácil entre los dos
lenguajes sin preocuparse por las diferencias sutiles que podrían hacer que su programa deje de
funcionar.
Tipo de Borrado
En términos generales, una vez que el compilador de TypeScript termina de verificar su código,
borra los tipos para producir el código "compilado" resultante. Esto significa que una vez que
se compila su código, el código JS simple resultante no tiene información de tipo.
Esto también significa que TypeScript nunca cambia el comportamiento de su programa en función
de los tipos que infirió. La conclusión es que, si bien es posible que vea errores de tipo
durante la compilación, el sistema de tipos en sí no influye en cómo funciona su programa cuando
se ejecuta.
Finalmente, TypeScript no proporciona bibliotecas de tiempo de ejecución adicionales. Sus
programas usarán la misma biblioteca estándar (o bibliotecas externas) que los programas de
JavaScript, por lo que no hay un marco adicional específico de TypeScript para aprender.
Aprendiendo JavaScript y TypeScript
Con frecuencia vemos la pregunta "¿Debo aprender JavaScript o TypeScript?".
¡La respuesta es que no se puede aprender TypeScript sin aprender JavaScript! TypeScript
comparte la sintaxis y el comportamiento en tiempo de ejecución con JavaScript, por lo que todo
lo que aprenda sobre JavaScript lo ayudará a aprender TypeScript al mismo tiempo.
Hay muchos, muchos recursos disponibles para que los programadores aprendan JavaScript; usted
debe no hacer caso omiso de estos recursos si usted está escribiendo a máquina. Por ejemplo, hay
aproximadamente 20 veces más preguntas de StackOverflow etiquetadas javascriptque typescript,
pero todas las javascriptpreguntas también se aplican a TypeScript.
Si se encuentra buscando algo como "cómo ordenar una lista en TypeScript", recuerde: TypeScript
es el tiempo de ejecución de JavaScript con un verificador de tipo en tiempo de compilación . La
forma de ordenar una lista en TypeScript es la misma forma en que lo hace en JavaScript. Si
encuentra un recurso que usa TypeScript directamente, eso también es genial, pero no se limite a
pensar que necesita respuestas específicas de TypeScript para preguntas cotidianas sobre cómo
realizar tareas en tiempo de ejecución.