Introducción a JavaScript
Fundamentos de JavaScript para Principiantes
Instalación y Configuración de JavaScript en Visual Studio Code
Instalación y configuración de Visual Studio Code y Node.js en Windows
Variables y Buenas Prácticas en JavaScript
Tipos de Datos en JavaScript: Primitivos y Complejos
Manipulación de Strings en JavaScript: Escritura, Concatenación y Substrings
Números y Operaciones Matemáticas en JavaScript
Conversión de Tipos en JavaScript: Implícita y Explícita
Conversión de Tipos en JavaScript: Explícita e Implícita
Estructuras de Control y Lógica
Operadores de Comparación en JavaScript: Igualdad y Desigualdad
Operadores Lógicos en Programación: AND, OR y NOT
Estructuras Condicionales: Uso de IF, ELSE y ELSE IF en JavaScript
Juego de Adivinanza: Programación con Estructuras Condicionales
Estructura y uso del condicional Switch en programación
Ciclo For: Iteración de Listas y Uso de Console.log en JavaScript
Iteración con for-of en JavaScript para arrays y strings
Iteración sobre Objetos con forIn en JavaScript
Uso del ciclo while para iteración en programación
Ciclos doWhile: Estructura y Diferencias con While
Funciones y This
Funciones en JavaScript: Cómo Calcular Precios con Descuentos
Diferencias entre Funciones y Métodos en JavaScript
Funciones Puras e Impuras en Programación: Conceptos y Ejemplos
Arrow Functions y Enlace Léxico en JavaScript
Scope y Contextos de Ejecución en JavaScript
Closures y Ámbito Léxico en JavaScript
Fundamentos del Desarrollo Web: Frontend y Backend
Manipulación de Arrays
Arrays: Propiedades, Acceso y Creación en Programación
Mutabilidad e inmutabilidad en arrays: conceptos y ejemplos prácticos
Métodos push y pop para modificar arrays en JavaScript
Métodos map y forEach en JavaScript: Uso y Ejemplos Prácticos
Métodos Filter y Reduce en JavaScript: Uso y Ejemplos Prácticos
Métodos find y findIndex en JavaScript: Uso y ejemplos prácticos
Uso del método slice para extraer porciones de un array en JavaScript
Uso del Spread Operator en JavaScript: Copia, Combinación y Más
Programación Orientada a Objetos
Programación Orientada a Objetos en JavaScript: Conceptos y Práctica
Creación y Manipulación de Objetos en JavaScript
Función constructora y gestión de instancias en JavaScript
Clases en JavaScript: Creación y Uso de Objetos con Sintaxis Moderna
Programación Orientada a Objetos en JavaScript: Clases y Prototipos
Prototipos y Herencia en JavaScript: Construcción y Uso Práctico
Métodos y herencia prototípica en JavaScript
Uso de "this" en Clases y Funciones Constructoras
Validación de Usuarios en una Red Social: Algoritmo Básico
Implementación de la Función Sign-In y Validación de Usuario
Asincronía en JavaScript
Programación Síncrona y Asíncrona en JavaScript
Promesas en JavaScript: Asincronía y Manejo de Estados
Uso de Async/Await para Promesas Asíncronas en JavaScript
Peticiones asíncronas con for await en JavaScript
Fundamentos de HTTP: Cliente-Servidor y Métodos de Petición
Peticiones HTTP en Frontend: Uso de Fetch y Análisis en Network
Peticiones HTTP en JavaScript: Fetch, GET, POST y DELETE
Envío de Datos al Servidor con JavaScript y Fetch API
Eliminar Posts con JavaScript y Delegación de Eventos
Manejo de IDs en JavaScript para eliminar artículos del DOM
Actualizaciones y Nuevas Funciones en JavaScript
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Para entender cómo se maneja la ejecución del código JavaScript, es crucial comprender los componentes clave de su motor de ejecución en los navegadores: el Memory Heap y el Call Stack.
El Memory Heap es el espacio donde se almacenan variables, funciones y objetos creados en JavaScript de forma aleatoria. Actúa como un almacén desorganizado donde el navegador gestiona la memoria de manera eficiente, permitiendo que las aplicaciones JavaScript funcionen sin problemas.
El Call Stack es una pila de tareas donde se registran las funciones que deben ejecutarse. Cuando se llama a una función, esta se agrega al Call Stack, ejecutándose de manera secuencial. Por ejemplo, si tienes una función holaMundo
que llama a otra función miNombreEsDiego
, el Call Stack ejecutará primero holaMundo
y luego miNombreEsDiego
, de forma simple y secuencial.
En un entorno síncrono, JavaScript ejecuta una tarea a la vez en el Call Stack. Este enfoque puede llegar al temido Stack Overflow, una situación en la que el Call Stack se llena más allá de su capacidad y el navegador puede bloquearse. Para solventar este problema, el navegador debe cerrarse y abrirse nuevamente.
JavaScript, por naturaleza, funciona de forma síncrona, ejecutando cada línea de código en orden. Sin embargo, ciertos mecanismos permiten que JavaScript también pueda manejar tareas asincrónicamente.
Las Web APIs son herramientas que permiten que JavaScript ejecute tareas de manera asíncrona, proporcionando simultaneidad. Cuando una función de Web API se llama, se transfiere a la sección de las Web APIs y se ejecuta en paralelo al Call Stack. Una vez completada, la tarea se mueve al Queue.
El Event Loop interroga constantemente al Call Stack para verificar si está vacío. Cuando lo está, extrae una tarea del Queue y la transfiere al Call Stack para ejecutar. De este modo, tareas asincrónicas se integran ordenadamente en el flujo de ejecución.
Considera un caso donde se utiliza setTimeout
, una función que actúa asincrónicamente:
function varFunc() {
console.log(1);
setTimeout(() => console.log(2), 0);
console.log(3);
}
La secuencia de ejecución sería:
console.log(1)
se ejecuta primero.setTimeout()
transfiere el console de 2
al Queue.console.log(3)
se ejecuta.2
del Queue al Call Stack.El resultado en consola sería: 1, 3 y 2. Aunque setTimeout
parece ser instantáneo, su resultado aparece solo cuando el Stack está vacío.
Las promesas en JavaScript, al igual que las funciones de Web API, facilitan la programación asíncrona. Permiten que funciones específicas se ejecuten en paralelo al flujo principal, mejorando la eficiencia y evitando cuellos de botella en aplicaciones de alto rendimiento.
async
y await
son sintaxis modernas para manejar promesas, haciendo que el código asíncrono se vea y se lea como si fuera síncrono. Proporcionan una forma más clara y manejable de estructurar código asincrónico, especialmente en operaciones complejas o jerárquicas.
Con esta comprensión, puedes mejorar la forma en que escribes y gestionas tu código JavaScript, maximizando sus capacidades síncronas y asíncronas. ¡Adelante, sigue explorando y dominando el mundo del desarrollo con JavaScript!
Aportes 17
Preguntas 0
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?