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无效,无法获取数据