async/await #
一、async/await概述 #
async/await是Promise的语法糖,让异步代码看起来像同步代码,提高了代码的可读性。
二、async函数 #
2.1 基本语法 #
typescript
async function greet(name: string): Promise<string> {
return `Hello, ${name}!`;
}
// 箭头函数
const greetArrow = async (name: string): Promise<string> => {
return `Hello, ${name}!`;
};
// 方法
const obj = {
async greet(name: string) {
return `Hello, ${name}!`;
}
};
2.2 返回值 #
async函数总是返回Promise:
typescript
async function example() {
return "值"; // 自动包装为 Promise.resolve("值")
}
example().then(value => console.log(value)); // "值"
2.3 异常处理 #
typescript
async function throwError() {
throw new Error("出错了"); // 自动包装为 Promise.reject
}
throwError().catch(error => console.error(error.message)); // "出错了"
三、await表达式 #
3.1 基本用法 #
typescript
async function fetchUser(id: number) {
const response = await fetch(`/api/users/${id}`);
const user = await response.json();
return user;
}
3.2 等待Promise #
typescript
async function delay(ms: number): Promise<void> {
await new Promise(resolve => setTimeout(resolve, ms));
}
async function example() {
console.log("开始");
await delay(1000);
console.log("1秒后");
}
3.3 等待非Promise值 #
typescript
async function example() {
const value = await 42; // 非Promise值会自动包装
console.log(value); // 42
}
3.4 顶层await #
Deno支持顶层await:
typescript
// 无需包装在async函数中
const response = await fetch("https://api.example.com/data");
const data = await response.json();
console.log(data);
四、错误处理 #
4.1 try/catch #
typescript
async function fetchUser(id: number) {
try {
const response = await fetch(`/api/users/${id}`);
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return await response.json();
} catch (error) {
console.error("获取用户失败:", error);
throw error;
}
}
4.2 多个await的错误处理 #
typescript
async function process() {
try {
const user = await fetchUser(1);
const posts = await fetchPosts(user.id);
return { user, posts };
} catch (error) {
console.error("处理失败:", error);
return null;
}
}
4.3 catch方法 #
typescript
async function fetchUser(id: number) {
const response = await fetch(`/api/users/${id}`);
return response.json();
}
fetchUser(1).catch(error => {
console.error("错误:", error);
});
五、并行执行 #
5.1 顺序执行 #
typescript
async function sequential() {
const a = await fetchA(); // 等待完成
const b = await fetchB(); // 再执行
const c = await fetchC(); // 再执行
return [a, b, c];
}
5.2 并行执行 #
typescript
async function parallel() {
const [a, b, c] = await Promise.all([
fetchA(),
fetchB(),
fetchC()
]);
return [a, b, c];
}
5.3 混合模式 #
typescript
async function mixed() {
// 并行获取用户和配置
const [user, config] = await Promise.all([
fetchUser(1),
fetchConfig()
]);
// 依赖用户数据
const posts = await fetchPosts(user.id);
return { user, config, posts };
}
六、实际应用 #
6.1 API请求 #
typescript
interface User {
id: number;
name: string;
email: string;
}
async function getUsers(): Promise<User[]> {
const response = await fetch("/api/users");
if (!response.ok) {
throw new Error(`获取用户失败: ${response.status}`);
}
return response.json();
}
async function createUser(user: Omit<User, "id">): Promise<User> {
const response = await fetch("/api/users", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(user)
});
if (!response.ok) {
throw new Error(`创建用户失败: ${response.status}`);
}
return response.json();
}
6.2 文件操作 #
typescript
async function readFile(path: string): Promise<string> {
try {
return await Deno.readTextFile(path);
} catch (error) {
if (error instanceof Deno.errors.NotFound) {
console.log("文件不存在");
return "";
}
throw error;
}
}
async function writeFile(path: string, content: string): Promise<void> {
await Deno.writeTextFile(path, content);
}
6.3 数据库操作 #
typescript
async function query(sql: string, params: unknown[]): Promise<unknown[]> {
const result = await db.query(sql, params);
return result.rows;
}
async function transaction<T>(fn: () => Promise<T>): Promise<T> {
await db.query("BEGIN");
try {
const result = await fn();
await db.query("COMMIT");
return result;
} catch (error) {
await db.query("ROLLBACK");
throw error;
}
}
七、最佳实践 #
7.1 避免不必要的async #
typescript
// 不推荐
async function getValue() {
return 42;
}
// 推荐
function getValue() {
return 42;
}
7.2 并行化独立操作 #
typescript
// 不推荐:顺序执行
async function getData() {
const users = await fetchUsers();
const posts = await fetchPosts();
return { users, posts };
}
// 推荐:并行执行
async function getData() {
const [users, posts] = await Promise.all([
fetchUsers(),
fetchPosts()
]);
return { users, posts };
}
7.3 正确处理错误 #
typescript
// 推荐:具体的错误处理
async function fetchUser(id: number) {
try {
const response = await fetch(`/api/users/${id}`);
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return await response.json();
} catch (error) {
if (error instanceof Deno.errors.NotFound) {
return null;
}
throw error;
}
}
八、总结 #
本章学习了:
- async函数的定义和返回值
- await表达式的使用
- 错误处理方式
- 并行执行技巧
- 实际应用场景
- 最佳实践
下一章,我们将学习异步迭代。
最后更新:2026-03-28