Promise
什么是 Promise?
Promise 是 JavaScript 中用于处理异步操作的一种机制。它表示一个异步操作的最终完成(或失败)及其结果的表示。Promise 对象代表一个异步操作,具有三种状态:Pending(进行中)、Fulfilled(已成功)和Rejected(已失败)。
创建一个 Promise
javascript
// 创建一个简单的 Promise 示例
const myPromise = new Promise((resolve, reject) => {
// 异步操作,可以是网络请求、定时器等
setTimeout(() => {
// 如果操作成功,则调用 resolve,并传递结果
resolve('Operation completed successfully');
// 如果操作失败,则调用 reject,并传递错误信息
// reject('Operation failed');
}, 2000);
});
Promise 方法
then() 方法
then() 方法用于指定 Promise 成功(Fulfilled)和失败(Rejected)状态的回调函数。
javascript
myPromise.then(
(result) => {
// 成功时执行的回调函数
console.log('Success:', result);
},
(error) => {
// 失败时执行的回调函数
console.error('Error:', error);
}
);
catch() 方法
catch() 方法用于捕获 Promise 中的错误。
javascript
myPromise.catch((error) => {
console.error('Error caught:', error);
});
finally() 方法
finally() 方法用于在 Promise 执行结束后执行一段代码,无论 Promise 是成功还是失败。
javascript
myPromise.finally(() => {
console.log('Promise execution completed.');
});
Promise 链式调用
Promise 支持链式调用,可以在一个 Promise 的 then() 中返回另一个 Promise。
javascript
const firstPromise = new Promise((resolve) => {
setTimeout(() => {
resolve(10);
}, 1000);
});
firstPromise
.then((result) => {
console.log('First promise resolved with:', result);
return result * 2;
})
.then((result) => {
console.log('Chained promise resolved with:', result);
return result * 3;
})
.then((result) => {
console.log('Final result:', result);
});
异步操作与串行执行
Promise 可以使异步操作更为简洁,并支持串行执行异步任务。
javascript
const asyncTask = (value) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(value * 2);
}, 1000);
});
};
asyncTask(2)
.then((result) => asyncTask(result))
.then((result) => asyncTask(result))
.then((result) => {
console.log('Final result of serial execution:', result);
});
Promise.all() 和 Promise.race()
Promise.all()
Promise.all() 接收一个 Promise 数组,当所有 Promise 都完成时,它返回一个新的 Promise,其中包含所有 Promise 结果组成的数组。
javascript
const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'resolved');
});
Promise.all([promise1, promise2, promise3]).then((values) => {
console.log('Promise.all() result:', values);
});
Promise.race()
Promise.race() 接收一个 Promise 数组,当数组中的任何一个 Promise 解决(无论成功或失败)时,它就会返回该 Promise 的结果。
javascript
const promiseA = new Promise((resolve) => {
setTimeout(resolve, 1000, 'Promise A resolved');
});
const promiseB = new Promise((resolve, reject) => {
setTimeout(reject, 500, 'Promise B rejected');
});
Promise.race([promiseA, promiseB]).then(
(result) => {
console.log('Promise.race() resolved:', result);
},
(error) => {
console.error('Promise.race() rejected:', error);
}
);
总结
Promise 是一种处理异步操作的强大工具,它提供了更清晰的代码结构,并支持串行执行、并行执行等操作。通过链式调用和多种方法(then、catch、finally、all、race 等),可以更好地管理和处理异步操作。