Promise 作为 JavaScript 异步编程的一种解决方案,能够有效地解决回调嵌套、代码可读性差等问题,更好地管理异步任务。本文将介绍 Promise 中常用的 6 种方法,分别是:Promise.all()、Promise.race()、Promise.resolve()、Promise.reject()、Promise.finally()和then()方法的链式调用。
1. Promise.all()
Promise.all()方法接收一个由 Promise 组成的数组,返回一个新的 Promise 对象。只有当数组中所有的 Promise 对象都变为 resolved 状态时,Promise.all() 生成的 Promise 对象才会变为 resolved 状态;当数组中任意一个 Promise 对象变为 rejected 状态时,Promise.all() 生成的 Promise 对象就会变为 rejected 状态。
const promise1 = Promise.resolve(1);
const promise2 = Promise.resolve(2);
const promise3 = Promise.resolve(3);
Promise.all([promise1, promise2, promise3]).then(values => {
console.log(values);
// [1, 2, 3]
});在上面的示例中,三个 Promise 对象都是 resolved 状态,Promise.all() 生成的 Promise 对象也是 resolved 状态,并且返回一个包含所有 Promise 对象结果的数组。
2. Promise.race()
Promise.race()方法同样接收一个由 Promise 组成的数组,返回一个新的 Promise 对象。只有当数组中任意一个 Promise 对象变为 resolved 或 rejected 状态时,Promise.race() 生成的 Promise 对象就会变为相应的状态。
// www.javascriptcn.com code example
const promise1 = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, 'one');
});
const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 2000, 'two');
});
Promise.race([promise1, promise2]).then(value => {
console.log(value);
// 'one'
});在上面的示例中,两个 Promise 对象都是 resolved 状态,但是Promise.race() 仍然会返回数组中第一个 Promise 对象执行完毕的结果。
3. Promise.resolve()
Promise.resolve()方法返回一个新的 Promise 对象,该对象的状态为 resolved。它接收的参数可以是一个 Promise 对象,也可以是一个非 Promise 对象。
// www.javascriptcn.com code example
Promise.resolve('Success').then(value => {
console.log(value);
// 'Success'
});
const promise = new Promise((resolve, reject) => {
resolve('resolved');
});
Promise.resolve(promise).then(value => {
console.log(value);
// 'resolved'
});在上面的示例中,第一个Promise.resolve()直接返回一个 resolved 状态的 Promise 对象,并且这个 Promise 对象的值为'Success'。
4. Promise.reject()
Promise.reject()方法返回一个新的 Promise 对象,该对象的状态为 rejected。它接收的参数可以是一个 Promise 对象,也可以是一个非 Promise 对象。
// www.javascriptcn.com code example
Promise.reject(new Error('error')).then(value => {
// 不会被执行
}).catch(reason => {
console.log(reason);
// Error: error
});
const promise = new Promise((resolve, reject) => {
reject('rejected');
});
Promise.reject(promise).catch(reason => {
console.log(reason);
// 'rejected'
});在上面的示例中,第一个Promise.reject()直接返回一个 rejected 状态的 Promise 对象,并且这个 Promise 对象的原因是new Error('error')。
5. Promise.finally()
Promise.finally()方法接收一个回调函数,当 Promise 对象状态变为 resolved 或者 rejected 时都会执行。该方法返回一个新的 Promise 对象,该对象的状态和值与原来的 Promise 对象一样。
// www.javascriptcn.com code example
Promise.resolve(123)
.finally(() => {
console.log('finally');
})
.then(value => {
console.log(value);
// 123
});
Promise.reject(new Error('error'))
.finally(() => {
console.log('finally');
})
.catch(reason => {
console.log(reason);
// Error: error
});在上面的示例中,Promise.finally()方法都会执行,无论 Promise 对象状态为 resolved 还是 rejected。在finally()方法中还可以改变 Promise 对象的状态,但是这个状态改变不会影响后面then()或者catch()的执行。
6. then()方法的链式调用
then()方法接收两个回调函数,分别是当 Promise 对象状态变为 resolved 时和 rejected 时需要执行的回调函数。then()方法也可以进行链式调用,每个链式调用都会返回一个新的 Promise 对象。
// www.javascriptcn.com code example
Promise.resolve(123)
.then(value => {
console.log(value);
// 123
return value + 1;
})
.then(value => {
console.log(value);
// 124
return Promise.reject(new Error('new error'));
})
.catch(reason => {
console.log(reason);
// Error: new error
});在上面的示例中,第一个then()方法返回一个新的 Promise 对象,该对象状态为 resolved,值为value + 1。第二个then()方法返回一个 rejected 状态的 Promise 对象。
小结
本文介绍了 Promise 中常用的 6 种方法,分别是Promise.all()、Promise.race()、Promise.resolve()、Promise.reject()、Promise.finally()和then()方法的链式调用。这些方法可以让我们更好地管理异步任务,提高代码质量和可读性。在实际开发中,我们需要结合具体需求选择适当的方法,学好 Promise 对于 JavaScript 异步编程是非常重要的。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67d7e6b0a941bf7134e21441