Referencia: https://es6.ruanyifeng.com/#docs/promise
Funciones comunes
Promise.prototype.then()
Promise.prototype.catch()
Promise.prototype.finally()
Promise.all()
Promise.race() //率先改变状态，p的状态就跟着改变
Promise.allSettled()
Promise.any()
Promise.resolve()
Promise.reject()
Promise.try()
Tabla de contenido
que es promesa
Promise, que es simplemente un contenedor que contiene el resultado de un evento (generalmente una operación asíncrona) que finalizará en el futuro. Sintácticamente, Promiseun objeto del que se pueden obtener mensajes para operaciones asíncronas. PromiseProporcione una API unificada y se pueden procesar varias operaciones asincrónicas de la misma manera. En pocas palabras, el papel de la promesa es 将异步操作以同步操作的流程表达出来evitar las funciones de devolución de llamada anidadas.
Características de las promesas
- Una operación asincrónica de promesa tiene tres estados:
进行中，已成功，已失败. Solo las operaciones asincrónicas pueden cambiar este estado. - Una vez que cambia el estado de la promesa, no volverá a cambiar.Hay dos posibilidades para el cambio del objeto de la promesa,
进行中—>已成功，进行中—>已失败.
Uso básico de las promesas
Un objeto de promesa es una 构造函数instancia de promesa que se utiliza para generar:
const promise = new Promise(function(resolve, reject) {
// ...
if (/* 满足条件 成功 反之失败 */){
resolve(value);
} else {
reject(error);
}
});
Ejemplo:
promise1(){
new Promise(function(resolve, reject) {
let intData = Math.floor (Math.random()*10)
if (intData > 3){
resolve('数据正确，大于3');
} else {
reject('数据错误，小于3');
}
}).then(res=>{
console.log(res)
}).catch(e=>{
console.log(e)
})
}
Los parámetros aceptados son resolvey rejectdos funciones:
resolve的作用: el estado del objeto de promesa por 进行中—>已完成. Y pase el resultado de la operación asíncrona como parámetro
rejected的作用: pase el estado del objeto de promesa 进行中—>已失败y el motivo de la falla asíncrona como parámetro.
uso de entonces
El método then puede aceptar dos funciones de devolución de llamada como parámetros. La primera función de devolución de llamada se llama cuando el estado del objeto prometido se resuelve (completado), y la segunda función de devolución de llamada (opcional) se llama cuando el estado del objeto prometido es rechazado ( fallado). ) cuando se le llama.
function timeout(ms) {
return new Promise((resolve, reject) => {
setTimeout(resolve, ms, 'done');
});
}
timeout(100).then((value) => {
console.log(value);
});
Encadenado entonces uso
El método then devuelve una nueva instancia de Promise (nota, no la instancia de Promise original). Por lo tanto, se puede usar el método de escritura en cadena, es decir, se llama a otro método luego después del método entonces.
getJSON("/post/1.json").then(function(post) {
return getJSON(post.commentURL);
}).then(function funcA(comments) {
// 成功
console.log("resolved: ", comments);
}, function funcB(err){
// 错误
console.log("rejected: ", err);
});
En el código anterior, la función de devolución de llamada especificada por el método first then devuelve otro objeto Promise. En este momento, la función de devolución de llamada especificada por el segundo método entonces esperará a que cambie el estado del nuevo objeto Promise. Si se resuelve, se llama a funcA, y si se rechaza el estado, se llama a funcB.
método de captura
En el objeto de promesa, si la operación asíncrona arroja un error, el estado se rechazará y se llamará a la función de devolución de llamada especificada por el método catch para manejar el error. Además, la función de devolución de llamada especificada por el método entonces también será capturado si se produce un error durante la operación método de captura.
p.then((val) => console.log('fulfilled:', val))
.catch((err) => console.log('rejected', err));
// 等同于
// 等同于
p.then((val) => console.log('fulfilled:', val))
.then(null, (err) => console.log("rejected:", err));
El error del objeto de promesa tiene una naturaleza "burbujeante" y se pasará hacia atrás hasta que se detecte, es decir, se saltará la función entonces en el medio.
getJSON('/post/1.json').then(function(post) {
return getJSON(post.commentURL);
}).then(function(comments) {
// some code
}).catch(function(error) {
// 处理前面三个Promise产生的错误
});
finalmente metodo
El método finalmente se utiliza para especificar una acción que se realizará independientemente del estado final del objeto de promesa.
server.listen(port).then(function () {
// ...
}).finally(server.stop);
El servidor maneja la solicitud con una promesa y luego cierra el servidor con el método finalmente().
métodopromise.all()
El método promise.all se usa para envolver varias instancias de promesa en una nueva instancia de promesa.
const p = Promise.all([p1, p2, p3]);
El método Promise.all acepta una matriz como parámetro, cuyos elementos son todos instancias de promesa, 如果不是，则会自动将参数转变为promie实例.
El estado de p está determinado por los elementos en su matriz, que se dividen en dos estados (usando el ejemplo anterior)
Solo cuando el estado de p1 p2 p3 se cumpla (completado) se cumplirá (completado).En este momento, los valores de retorno de p1 p2 p3 forman una matriz y la pasan a la función de devolución de llamada de p.
Entre p1 p2 p3, uno es rechazado (sin terminar) y el estado de p pasará a ser rechazado (sin terminar) En este momento, el valor de retorno de la primera instancia rechazada se pasará a la función de devolución de llamada de p.
métodopromise.race()
El método Promise.race también envuelve múltiples instancias de Promise en una nueva instancia de Promise
const p = Promise.race([p1, p2, p3]);
一个实例率先改变Hay estados entre p1, p2 y p3 , p的状态就跟着改变. El valor de retorno de la instancia de Promise que cambió primero se pasa a la función de devolución de llamada de p.
función asíncrona
Aviso:! ! El comando await solo se puede usar en funciones asíncronas y se informará un error en las funciones ordinarias.
La introducción de async hace que las operaciones asíncronas sean más convenientes.¿Qué es la función async?, de hecho, es el azúcar sintáctico de la función Generator. Haga que las funciones asincrónicas y las funciones de devolución de llamada se parezcan más a las funciones sincrónicas en la sintaxis. El generador no se presenta aquí. Vayamos directamente a aprender asíncrono
El valor de retorno de async es un objeto de promesa, por lo que puede usar el método entonces para agregar una función de devolución de llamada.Cuando se ejecuta la función, una vez que encuentra await, regresará primero, esperará hasta que se complete la operación asíncrona y luego ejecutará el contenido detrás del cuerpo de la función.
async function getStockPriceByName(name) {
const symbol = await getStockSymbol(name);
const stockPrice = await getStockPrice(symbol);
return stockPrice;
}
getStockPriceByName('goog').then(function (result) {
console.log(result);
});
La forma de uso de la función asíncrona
//函数声明
async function foo(){
}
//函数表达式
const foo = async function（）{
}；
//对象的方法
let obj = {
async foo(){
}};
obj.foo().then(...)
//箭头函数
const foo =async()=>{
}；
El valor devuelto por la declaración de devolución dentro de la función asíncrona se convertirá en el parámetro de la función de llamada al método.
async function f(){
return ‘hello world’；
}
f().then(v=> console.log(v))
//"hello world"
esperar comando
En circunstancias normales, el comando await va seguido de un objeto de promesa; de lo contrario, se convertirá automáticamente en un objeto de promesa.
async function f(){
return await 123;
}
f().then(v =>console.log(v))
//123
async function f() {
await Promise.reject('出错了');
await Promise.resolve('hello world'); // 不会执行
}
manejo de errores
Si la operación asincrónica detrás de await es incorrecta, se rechazará el objeto de promesa equivalente al devuelto por la función asíncrona (como se mencionó anteriormente al hablar sobre el objeto de promesa, la naturaleza burbujeante)
async function f() {
await new Promise(function (resolve, reject) {
throw new Error('出错了');
});
}
f().then(v => console.log(v))
.catch(e => console.log(e))
// Error：出错了
Utilice los bloques try...catch para evitar errores.
async function f() {
try {
await new Promise(function (resolve, reject) {
throw new Error('出错了');
});
} catch(e) {
}
return await('hello world');
}
Se colocan varios comandos de espera en las estructuras try...catch
async function main() {
try {
const val1 = await firstStep();
const val2 = await secondStep(val1);
const val3 = await thirdStep(val1, val2);
console.log('Final: ', val3);
}
catch (err) {
console.error(err);
}
}
Propiedades relacionadas
La diferencia entre allSettled() y all()
- all() devuelve un envoltorio directo
resolve内容的数组, allSettled() devuelve un envoltorio对象的数组. - all() Si un objeto Promise informa un error, no se puede ejecutar all(), se informará su error y no se podrán obtener otros datos exitosos. El método allSettled() devuelve todos los datos de la instancia de Promise en un objeto independientemente de si hay un error. Si se trata de datos resueltos, se cumple el valor de estado, en caso contrario se rechaza.
Promise.resolve() 与 Promise.reject()
resolve 成功
reject 失败
Promesa.intentar()
Solucionar problemas.