Asincronía en JavaScript

5. Asincronía en JavaScript

La asincronía en JavaScript es la capacidad de ejecutar código de forma no bloqueante, lo que permite que el navegador siga respondiendo a eventos del usuario mientras se ejecuta el código en segundo plano.

5.1 Callbacks

Un callback es una función que se pasa como argumento a otra función y se ejecuta cuando se completa una tarea asíncrona.

Ejemplo:

function obtenerDatos(callback) {
  setTimeout(function() {
    let datos = "Datos obtenidos";
    callback(datos);
  }, 2000);
}

obtenerDatos(function(datos) {
  console.log(datos);
});

5.2 Promesas

Una promesa es un objeto que representa la eventual finalización o el fracaso de una operación asíncrona. Las promesas se utilizan para manejar el flujo de código asíncrono de forma más fácil y legible que los callbacks.

Ejemplo:

let promesa = new Promise(function(resolve, reject) {
  setTimeout(function() {
    let datos = "Datos obtenidos";
    resolve(datos);
  }, 2000);
});

promesa.then(function(datos) {
  console.log(datos);
});

5.3 Async/await

Async/await es una sintaxis especial para trabajar con promesas de forma más fácil y legible. La palabra clave «async» se utiliza para definir una función asíncrona, y la palabra clave «await» se utiliza para esperar a que se complete una promesa.

Ejemplo:

async function obtenerDatos() {
  let promesa = new Promise(function(resolve, reject) {
    setTimeout(function() {
      let datos = "Datos obtenidos";
      resolve(datos);
    }, 2000);
  });

  let datos = await promesa;
  console.log(datos);
}

obtenerDatos();

5.4 Manejo de errores

El manejo de errores en JavaScript se realiza mediante la palabra clave «try» para el código que puede generar un error, y la palabra clave «catch» para el código que maneja el error.

Ejemplo:

try {
  let numero = 10 / 0;
} catch (error) {
  console.log("Ocurrió un error: " + error.message);
}

5.5 Fetch API y Axios

La Fetch API es una interfaz de JavaScript para hacer peticiones HTTP a servidores remotos. Axios es una librería de JavaScript que facilita la realización de peticiones HTTP.

Ejemplo:

// Fetch API
fetch("https://jsonplaceholder.typicode.com/posts")
  .then(function(respuesta) {
    return respuesta.json();
  })
  .then(function(datos) {
    console.log(datos);
  });

// Axios
axios.get("https://jsonplaceholder.typicode.com/posts")
  .then(function(respuesta) {
    console.log(respuesta.data);
  });

5.6 Ejemplos y casos de uso

Algunos ejemplos y casos de uso de la asincronía en JavaScript incluyen:

• Cargar datos de forma asíncrona desde un servidor remoto.
• Realizar varias tareas asíncronas en paralelo y esperar a que todas se completen.
• Crear una interfaz de usuario reactiva que responda a eventos del usuario mientras se ejecuta código en segundo plano.
• Realizar tareas pesadas en segundo plano sin bloquear el hilo principal del navegador.
• Crear un sistema de carga diferida de recursos para mejorar el rendimiento de la página web.