Promise 基础
Promise
是JavaScript中用于处理异步操作的一个关键概念。它代表了一个尚未完成但预期在将来完成的操作。使用Promise,可以避免所谓的“回调地狱”,即多层嵌套的回调函数,从而使代码更加清晰和易于维护。
代码示例:创建一个基本的Promise
let promise = new Promise(function(resolve, reject) {
// 异步操作代码
setTimeout(() => {
resolve("操作成功");
}, 1000);
});
promise.then((value) => {
console.log(value); // 输出:操作成功
});
Promise 的状态
一个Promise有三种可能的状态:
- pending(待定) :初始状态,既不是成功,也不是失败。
- fulfilled(已实现) :意味着操作成功完成。
- rejected(已拒绝) :意味着操作失败。
代码示例:展示不同状态的Promises
let fulfilledPromise = Promise.resolve('成功');
let rejectedPromise = Promise.reject('失败');
fulfilledPromise.then(value => console.log(value)); // 输出:成功
rejectedPromise.catch(error => console.log(error)); // 输出:失败
链式调用和错误处理
Promise
的另一个优点是可以通过链式调用.then()
和.catch()
方法来处理复杂的异步流程。
代码示例:展示链式调用和错误处理
new Promise((resolve, reject) => {
setTimeout(() => resolve(1), 1000);
})
.then(result => {
console.log(result); // 输出 1
return result * 2;
})
.then(result => {
console.log(result); // 输出 2
return result * 3;
})
.then(result => {
console.log(result); // 输出 6
return result * 4;
})
.catch(error => {
console.log('捕获到错误:', error);
});
Async 函数
通过在函数声明前加上async
关键字,可以将任何函数转换为返回Promise的异步函数。这意味着你可以使用.then()
和.catch()
来处理它们的结果。
代码示例:创建一个async函数
async function asyncFunction() {
return "异步操作完成";
}
asyncFunction().then(value => console.log(value)); // 输出:异步操作完成
Await 关键字
await
关键字只能在async
函数内部使用。它可以暂停async函数的执行,等待Promise的解决(resolve),然后以Promise的值继续执行函数。
代码示例:在async函数中使用await
async function asyncFunction() {
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve("完成"), 1000)
});
let result = await promise; // 等待,直到promise解决 (resolve)
console.log(result); // "完成"
}
asyncFunction();
错误处理
在async/await
中,错误处理可以通过传统的try...catch
语句实现,这使得异步代码的错误处理更加直观。
代码示例:使用try...catch处理错误
async function asyncFunction() {
try {
let response = await fetch('http://example.com');
let data = await response.json();
// 处理数据
} catch (error) {
console.log('捕获到错误:', error);
}
}
asyncFunction();