Introducción a las promesas
una promesa se define comúnmente como un proxy para un valor que eventualmente estará disponible.
Las promesas son una forma de lidiar con el código asíncrono, sin quedarse atascado en el infierno de devolución de llamada.
Las promesas han sido parte del lenguaje durante años (estandarizadas e introducidas en ES2015), y recientemente se han integrado más, con async y await en ES2017.,
Las funciones asincrónicas usan promesas entre bastidores, por lo que comprender cómo funcionan las promesas es fundamental para comprender cómo funcionan async y await.
cómo funcionan las promesas, en resumen
Una vez que se ha llamado a una promesa, comenzará en un estado pendiente. Esto significa que la función que llama continúa ejecutándose, mientras que la promesa está pendiente hasta que se resuelva, dando a la función que llama los datos que se estaban solicitando.,
la promesa creada terminará eventualmente en un estado resuelto, o en un estado rechazado, llamando a las respectivas funciones de devolución de llamada (pasadas a then y catch) al finalizar.
¿qué API de JS prometen usar?
además de su propio código y código de bibliotecas, las promesas son utilizadas por API web modernas estándar como:
- La API de batería
- La API de búsqueda
- Service Workers
es poco probable que en JavaScript moderno no use promesas, así que comencemos a bucear directamente en ellas.,
creando una promesa
la API de promesa expone un constructor de promesa, que inicializa usando new Promise():
como puede ver, la promesa comprueba la done constante global, y si eso es cierto, la promesa va a un estado resuelto (ya que la resolve callback was called); de lo contrario, el reject callback se ejecuta, poniendo la promesa en un estado rechazado., (Si no se llama a ninguna de estas funciones en la ruta de ejecución, la promesa permanecerá en estado pendiente)
Usando resolve y reject, podemos comunicar al llamante cuál era el estado de promesa resultante y qué hacer con él. En el caso anterior solo devolvimos una cadena, pero podría ser un objeto, o null también. Debido a que hemos creado la promesa en el fragmento anterior, ya ha comenzado a ejecutarse. Esto es importante para entender lo que está pasando en la sección consumir una promesa a continuación.,
un ejemplo más común que puede encontrar es una técnica llamada Promisificación. Esta técnica es una forma de poder usar una función JavaScript clásica que recibe una devolución de llamada, y hacer que devuelva una promesa:
en versiones recientes de Node.js, usted no tendrá que hacer esta conversión manual para una gran parte de la API. Hay una función promisificadora disponible en el módulo util que hará esto por Usted, dado que la función que está promisificando tiene la firma correcta.,
consumir una promesa
en la última sección, presentamos cómo se crea una promesa.
ahora veamos cómo se puede consumir o usar la promesa.
Ejecutar checkIfItsDone() especificará las funciones a ejecutar cuando el isItDoneYet promesa resuelve (en el then call) o rechaza (en el catch llamada).
encadenar promesas
una promesa puede ser devuelta a otra promesa, creando una cadena de promesas.,
un gran ejemplo de encadenamiento de promesas es la API Fetch, que podemos usar para obtener un recurso y poner en cola una cadena de promesas para ejecutar cuando se obtiene el recurso.
la API Fetch es un mecanismo basado en promesas, y llamar a fetch() equivale a definir nuestra propia promesa usando new Promise().
ejemplo de encadenamiento de promesas
en este ejemplo, llamamos a fetch() para obtener una lista de elementos TODO del archivo todos.json que se encuentra en la raíz del dominio, y creamos una cadena de promesas.,
Ejecutar fetch() devuelve una respuesta, que tiene muchas propiedades, y dentro de las cuales hacemos referencia:
-
status, un valor numérico que representa el código de estado HTTP -
statusText, un mensaje de estado, que esOKsi la solicitud tuvo éxito
response también tiene un método json(), que devuelve una promesa que se resolverá con el contenido del cuerpo procesado y transformado en JSON.,
así que dadas esas premisas, esto es lo que sucede: la primera promesa en la cadena es una función que definimos, llamada status(), que comprueba el estado de la respuesta y si no es una respuesta exitosa (entre 200 y 299), rechaza la promesa.
esta operación hará que la cadena de promesas omita todas las promesas encadenadas enumeradas y saltará directamente a la instrucción catch() en la parte inferior, registrando el texto Request failed junto con el mensaje de error.,
si eso tiene éxito, llama a la función json() que definimos. Dado que la promesa anterior, cuando tuvo éxito, devolvió el objeto response, lo obtenemos como entrada para la segunda promesa.
en este caso, devolvemos los datos JSON procesados, por lo que la tercera promesa recibe el JSON directamente:
.then((data) => { console.log('Request succeeded with JSON response', data)})y simplemente lo registramos en la consola.
manejo de errores
en el ejemplo, en la sección anterior, teníamos un catch que se anexó a la cadena de promesas.,
Cuando algo en la cadena de promesas falla y genera un error o rechaza la promesa, el control va a la instrucción catch() más cercana en la cadena.
errores en cascada
Si dentro del catch() se genera un error, puede añadir un segundo catch() para manejarlo, y así sucesivamente.
new Promise((resolve, reject) => { throw new Error('Error')}) .catch(err => { throw new Error('Error') }) .catch(err => { console.error(err) })orquestar promesas
promesa.,all()
Si necesita sincronizar diferentes promesas, Promise.all() le ayuda a definir una lista de promesas, y ejecutar algo cuando se resuelven.
Ejemplo:
El ES2015 desestructuración de asignación de sintaxis permite también hacer
Promise.all().then(() => { console.log('Results', res1, res2)})Usted no está limitado a usar fetch por supuesto, cualquier promesa puede ser utilizado de esta manera.
Promesa.,race()
Promise.race() se ejecuta cuando se resuelve la primera de las promesas que le pasas, y ejecuta la devolución de llamada adjunta solo una vez, con el resultado de la primera promesa resuelta.,
Ejemplo:
errores Comunes
Uncaught TypeError: indefinido no es una promesa
Si usted consigue el Uncaught TypeError: undefined is not a promise error en la consola, asegúrese de usar new Promise() en lugar de sólo Promise()
UnhandledPromiseRejectionWarning
Esto significa que una promesa se llama rechazado, pero no había catch utilizarse para controlar el error. Agregue un catch después del infractor then para manejar esto correctamente.