1.05 TypeScript当中，什么时候使用异步函数？有哪些注意事项

在 TypeScript 中, 以下情况通常需要使用异步函数:

1. 处理网络请求: 当需要发送 HTTP 请求或与 API 交互时, 应使用异步函数。例如:

async function fetchData(): Promise<Data> {
  const response = await fetch('https://api.example.com/data');
  return response.json();
}

2. 文件操作: 读写文件等 I/O 操作通常是异步的。

import fs from 'fs/promises';
 
async function readFile(path: string): Promise<string> {
  const content = await fs.readFile(path, 'utf-8');
  return content;
}

3. 数据库操作: 与数据库的交互通常是异步的。

async function getUserFromDB(id: number): Promise<User> {
  const user = await db.users.findOne({ id });
  return user;
}

4. 定时器操作: 当需要延迟执行某些操作时。

function delay(ms: number): Promise<void> {
  return new Promise(resolve => setTimeout(resolve, ms));
}
 
async function delayedGreeting(name: string): Promise<void> {
  await delay(1000);
  console.log(`Hello, ${name}!`);
}

5. 并行操作: 当需要同时执行多个异步操作时。

async function fetchMultipleData(): Promise<Data[]> {
  const [data1, data2, data3] = await Promise.all([
    fetchData1(),
    fetchData2(),
    fetchData3()
  ]);
  return [data1, data2, data3];
}

使用异步函数时的注意事项:

1. 始终使用 async/await 语法, 而不是回调函数, 以提高代码可读性。

2. 正确处理错误: 使用 try/catch 块或 .catch () 方法捕获异步操作中的错误。

async function fetchData() {
  try {
    const data = await someAsyncOperation();
    // 处理数据
  } catch (error) {
    console.error('An error occurred:', error);
  }
}

3. 返回类型应为 Promise<T>,其中 T 是实际返回值的类型。

4. 避免在循环中使用 await, 因为这会导致串行执行。如果需要并行执行, 使用 Promise.all()。

5. 注意异步函数的执行顺序, 它们不会阻塞其他代码的执行。

6. 在组件生命周期方法或事件处理程序中使用异步函数时要小心, 确保组件仍然挂载。

7. 使用 TypeScript 的 async/await 类型推断来简化代码。

8. 考虑使用取消令牌 (cancellation tokens)来管理长时间运行的异步操作。

通过遵循这些最佳实践, 你可以更有效地在 TypeScript 中使用异步函数, 提高代码的可读性和可维护性。

Citations: [1] https://juejin.cn/post/6926794697553739784 [2] https://cloud.tencent.com/developer/article/1859075 [3] https://www.cnblogs.com/xiaonian8/p/14096702.html [4] https://juejin.cn/post/6985296521495314445 [5] https://www.51cto.com/article/750369.html