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