¿Cómo funciona JavaScript?

Autor: | Última modificación: 4 de mayo de 2022 | Tiempo de Lectura: 3 minutos
Temas en este post:

Algunos de nuestros reconocimientos:

Premios KeepCoding

Seguramente habrás escuchado alguna vez que “JavaScript usa una cola de callback”, “tiene un solo subproceso” o “el motor V8 de JavaScript”, sin entender mucho al respecto. En este post vas a aprender de forma profunda, concisa y muy técnica cómo funciona JavaScript y de qué forma se ejecuta.

Cómo funciona JavaScript

Como ya hemos mencionado, lo fundamental que debes saber para conocer cómo funciona JavaScript es que el soporte para los proyectos en distintos niveles (desde dispositivos integrados o aplicaciones híbridas hasta front y back-end) lo hace en uno de los lenguajes más importantes en la actualidad.

Ahora, recuerda que el esquema general de una página web es un documento HTML donde están todas las etiquetas HTML de la página. Dentro de ese extenso documento pueden existir relaciones o referencias a otros documentos como archivos CSS o JavaScript.

Por ejemplo, si hay dentro del documento HTML una referencia a un archivo CSS, el navegador lo descarga y aplica al documento HTML para cambiar su aspecto visual. De igual modo, si introduces una referencia a un archivos JavaScript, el navegador descargará y ejecutará las órdenes de interactividad que allí se indiquen. Pero, realmente, ¿cómo funciona JavaScript?

Motor JavaScript

Por lo que te hemos mencionado arriba sobre cómo funciona JavaScript, ya entenderás que el navegador realiza el proceso de aplicar y descargar las instrucciones contenidas en un documento de referencia dentro del HTML, sin embargo, no es precisamente el navegador el que hace esto, sino lo que conocemos como el motor de JavaScript o el JavaScript Engine, por su nombre en inglés.

Este es precisamente el software que interpreta el código de JavaScript al tiempo que ejecuta un script de acuerdo a las indicaciones dictadas. Todos los navegadores contienen un motor JavaScript; los más famosos son:

V8 Engine

V8 Engine es un motor open source creado por google y es el que utiliza Google Chrome. Además de funcionar en este navegador, también se ha adaptado para correr del lado servidor haciendo que JavaScript se utilice como un lenguaje de programación back-end.

Chakra Engine

Chakra fue creado por Microsoft, de modo que ya podrás deducir que se utiliza en su navegador web Internet Explorer 9 y el nuevo Microsoft Edge, que viene incluido con sus sistemas operativos Windows 10. En 2015 se liberó su código fuente y se convirtió también en un open source.

Carakan Engine

Por otro lado, Carakan fue creado por Opera Software y lo utiliza su famoso navegador Opera.

SpiderMonkey Engine

SpiderMonkey, creado por la fundación Mozilla, evidentemente lo utiliza su mismo navegador web: Mozilla Firefox.

Tiempo de ejecución

En el mundo del desarrollo web, no utilizas usualmente el motor de forma directa. Justamente, el motor de JavaScript funciona dentro de un ambiente o entorno, a lo que nos referimos cuando hablamos de runtime o runtime environment. Este proporciona características adicionales a tus scripts que puedes usar al tiempo que se ejecuta el código. 

¿Qué clase de características?

Diferentes librerías o APIs que permiten la comunicación con el mundo que rodea al motor. Un ejemplo podría ser el «setTimeout()«, AJAX o, en términos prácticos, acceder a información acerca del navegador en el cual se está ejecutando. Aquí encontrarás los populares “Queue Callback” (la cola de funciones) o el “Event Loop” (bucle de eventos)

Call Stack

Cuando escuchas decir que JavaScript es un lenguaje de programación de único subproceso, esto se refiere a que tiene una sola “Pila de llamado a funciones” o Call Stack. Esto significa que puede hacer una sola cosa a la vez.

¿Qué es el Call Stack?

Es una estructura de datos que registra en qué parte del programa estás. Cuando ejecutas un Script, el motor de JavaScript crea un “Contexto Global de Ejecución” y lo posiciona en la parte superior de la pila de llamado. Cada vez que una función es requerida, el motor crea este contexto para esa función, la posiciona en la parte superior de la pila y comienza a ejecutar la función. Si esa función requiere otra función, el motor crea un nuevo contexto para la función que es requerida y vuelve a posicionarla en el tope de la pila. 

Cuando la función actual termina de ejecutarse, el motor de JavaScript la saca de la pila de llamado, reanuda la ejecución de funciones en donde había quedado y el Script terminará de ejecutarse cuando esta pila se encuentre vacía.

¿Por dónde continuar?

Con este post has aprendido de forma muy técnica y directa cómo funciona JavaScript, pero ¿te has quedado con curiosidad y te gustaría aprender cómo se traduce todo esto a términos más prácticos? Con nuestros bootcamps disponibles podrás tener acceso al mejor y más completo curso de Javascript en internet. ¿A qué esperas para inscribirte?

Posts Relacionados

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado