# ¿Qué es asincronismo?

Uno de los conceptos con mayor relevancia en **JavaScript**, y en casi todos los lenguajes de programación, es el **asincronismo**. Sería raro pensar que, en el desarrollo de aplicaciones web en el 2020, sigamos desarrollando aplicaciones sin asincronismo.

Pero **¿qué es asincronismo?** Estas son tareas que al ser ejecutadas pueden ser completadas en el momento o en el futuro y que su comportamiento es no bloqueante.&#x20;

Un ejemplo común sería el siguiente: si nuestra app **solicita el catálogo de productos,** esta envía una orden a través de una API, pero es el servidor quién procesa dicha solicitud y en el momento que esté listo devolverá el **listado de datos**. En este punto nuestra app desconoce el tiempo que se toma el servidor en responder la petición, por lo que si utilizáramos una **función síncrona** se estaría todo ese tiempo esperando los datos y bloqueando el proceso de las funciones subsecuentes. En cambio una función asíncrona enviará la petición a la **API**, nuestra aplicación continuará con la ejecución de otras tareas y cuando el servidor responda se notificará que los datos están listos para ser procesados.

Para entender este concepto primero tenemos que tener claro que JavaScript **no es capaz** de ejecutar más de una tarea a la vez, sin importar la cantidad nucleos que tenga tu computadora o servidor. A pesar de que JavaScript no es un lenguaje multi-tarea, o con paralelismo, es altamente **concurrente**.&#x20;

A pesar de lo que se suele creer, la respuesta es que no es necesario contar con más de un núcleo para poder emplear tareas de forma **asíncrona**. Por ejemplo, una técnica bastante usada es el **entrelazado en el que dos tareas grandes se dividen en varias pequeñas** y se ejecutan una del primer proceso seguida de otra del siguiente proceso.

Por lo que técnicamente definiremos a JavaScript como un lenguaje de programación con un modelo de concurrencia asíncrono por medio del **Event Loop** en un único **hilo** o thread de ejecución. A pesar de que JavaScript no es multitareas este puede delegar la ejecución de ciertas funciones a otros procesos y cuya llamada será devuelta inmediatamente evitando así el bloqueo de la aplicación, cuando dicho proceso haya sido capaz de resolver la tarea enviará un mensaje de notificación y procesará la respuesta mediante el **callback**, **promise** o **evento**.

Para hacer uso del Event Loop deberemos utilizar y comprender dos elementos más: **call stack** y **callback queue**. La pila de llamadas o call stack es donde se apilan las **llamadas a funciones** según el orden en el que llegan, ejecutándose primero las que se encuentran encima; por ejemplo: si una función hace un llamado a otra función, esta última estará en la parte superior y será la que se ejecute primero. Anteriormente habíamos hablado que podíamos delegar tareas a otros procesos que no bloquearan la aplicación y cuyos resultados nos fueran notificados mediante mensajes para procesar las respuestas con **callback’s**, pues dichos callback’s serán las funciones que se encolan en el callback queue y en el momento que se hayan procesado todas las funciones de la pila de llamadas será el momento en el que las funciones que están en el callback que envíen al call stack para ser ejecutadas.

![](https://lh4.googleusercontent.com/vY2ClP4xsc12vFHtP5Uz9Ms_8WE8QBQfFQYIArynpd0SuodWEc7H1tcSHXVJKPIBw6otjXDEFOpzq_VJH96n1V_KHWh8_bH7zaywmYYpb4KRKVhuNcB93jhlYPtthFGsjtVEDjLT)

Existen 3 maneras con las que podemos implementar asincronismo, estas son: **Utilizando callback’s, promises** y con **async/await.**

### **Callback’s**

Esta es la forma más antigua para emplear **asincronismo en JavaScript.** Y consiste en una función que se pasará como parámetro de otra función, en donde la función principal será la encargada de hacer el llamado de nuestro **callback (la función parámetro).** Cuando esta función principal es **no-bloqueante,** utilizará este callback para dar respuesta hasta el momento en que los resultados estén listos, hayan **sido satisfactorios o no.**

Por ejemplo, si queremos consultar datos en Internet lo normal sería que consumamos una **API,** el resultado estará listo en un tiempo indeterminado por lo que sería lógico emplear asincronismo en este caso, nuestra función no bloqueará el hilo principal de nuestra aplicación y cuando tengamos la respuesta de la API llamaremos al **callback** para procesar el resultado; ya sea que obtuvimos los datos o un error.

### Promises o Promesas

Las promesas son una característica más reciente que fue añadida en la **versión 6** del estándar **ECMAScript**. Esta característica nos permite emplear **asincronismo** en nuestras aplicaciones y mejora a los callback’s porque **evita** el **callback hell;** además de que nos permite escribir un código más limpio. Una promesa se define como una función **no-bloqueante** y asíncrona cuyo valor de retorno puede estar disponible justo en el momento, en el futuro o nunca.

![](https://lh6.googleusercontent.com/rGQP4OZ0HLncWu4sak1M3RS0xyHqjSIBr2Uv5FwbNJDD7XWAgqn_hj6OvIrz2Gan6cQGhviMDQZPKQvlejQgQAZF3vMoQVs-2O0-bdaZJOaNvYmzAWVgtEkq1VE18IHtGy5JPh1U)

### Async / Await

Esta es la forma más reciente de emplear **asincronismo** en JavaScript, la cual apareció en la **versión 8** del estándar **ECMAScript**. La técnica introdujo dos palabras reservadas al lenguaje, estas son **async** y **await**, las cuales emplearemos en conjunto. Con async podemos definir que una función sea asíncrona. En el caso de await se emplea para esperar un resultado de otra función asíncrona que retorne un objeto **promise** (las funciones definidas con **async** también retornan un objeto promise, por lo que pueden ser tratadas como promesas). Cabe destacar que, en una función definida con async, podemos emplear **await** la cantidad de veces que deseemos por lo que el encadenamiento no es un problema en esta parte.

Por último, para el tratamiento de errores normalmente emplearemos el **try/catch** bastante común en tantos lenguajes de programación.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://https-bedu-org.gitbook.io/javascript-desde-cero/parte-6/asincronismo/que-es-asincronismo.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
