1.Promise和async/await的作用
Promise:是一种处理异步操作的对象,它表示一个尚未完成但预期会完成的操作。Promise 有三种状态:
Pending(进行中):初始状态,既不是成功,也不是失败。
Fulfilled(已成功):操作成功完成。
Rejected(已失败):操作失败。
async/await:是基于 Promise 的语法糖,让异步代码看起来像同步代码,更易于理解和维护。
2.promise基础用法:
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
3.Promise与async/await结合使用
示例:
// 创建一个 Promise
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
const data = "这是异步获取的数据";
resolve(data); // 成功时调用 resolve
}, 2000);
});
}
// 使用 async/await 调用 Promise
async function getData() {
try {
console.log("开始获取数据...");
const result = await fetchData(); // 使用 await 等待 Promise 完成
console.log("获取到的数据:", result);
} catch (error) {
console.error("获取数据失败:", error);
}
}
// 调用 async 函数
getData();
输出结果:
开始获取数据...
(2秒后)
获取到的数据: 这是异步获取的数据
总结:
promise函数的两个参数resolve和reject是两个函数。
resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 fulfilled),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。async 关键字用于声明一个函数是异步的,函数内部可以使用 await
await只能在async函数中使用,如果在非async函数中使用await,会报语法错误
async声明的函数会返回一个 Promise 对象。await用于等待 Promise 完成,它会暂停当前函数的执行,直到 Promise 的状态变为Fulfilled或Rejected,但不会阻塞主线程。主线程可以继续执行其他任务。如果 Promise 成功,
await会将 Promise 的结果赋值给变量(这里是result)。如果 Promise 失败,
await会抛出错误,可以通过try...catch捕获使用
async/await时,需要将函数声明为async,然后用await等待 Promise 完成。
使用
async/await时,一定要用try...catch捕获错误,否则如果 Promise 失败,可能会导致程序崩溃。
4.再举一个使用到reject的例子
function fetchUserData(userId) {
return new Promise((resolve, reject) => {
// 模拟异步操作,比如网络请求
setTimeout(() => {
// 假设服务器返回的结果
const serverResponse = {
success: userId > 0, // 假设 userId > 0 时请求成功,否则失败
data: {
name: "Alice",
age: 25
}
};
if (serverResponse.success) {
// 如果成功,调用 resolve
resolve(serverResponse.data);
} else {
// 如果失败,调用 reject
reject("用户ID无效,无法获取数据");
}
}, 2000);
});
}
async function getUserData(userId) {
try {
console.log("开始获取用户数据...");
const userData = await fetchUserData(userId); // 使用 await 等待 Promise 完成
console.log("获取到的用户数据:", userData);
} catch (error) {
// 如果 Promise 被 reject,错误会在这里被捕获
console.error("获取用户数据失败:", error);
}
}
// 测试成功的情况
getUserData(1);
// 测试失败的情况
getUserData(-1);
输出结果:
成功
开始获取用户数据...
(2秒后)
获取到的用户数据: { name: 'Alice', age: 25 }
失败
开始获取用户数据... (2秒后) 获取用户数据失败: 用户ID无效,无法获取数据