使用 Async/Await ​编写异步代码的使用五个优秀实践

作者：前端小智 2023-04-14 08:10:59开发 前端 在这篇博客文章中，我们将讨论async/await - 一种在各种编程语言中编写异步代码的​编步代强大工具。

这篇文章介绍了使用 async/await 编写异步代码的写异秀实 5 个最佳实践。文章中的个优第一个建议是在所有异步代码中使用 async/await。这样做的使用好处有以下几点：首先，它使代码库保持一致性。​编步代通过在所有异步代码中使用 async/await，写异秀实你可以保持一致的个优代码编写和组织方式。此外，使用async/await 有助于提高代码可读性和易于维护。​编步代这是写异秀实因为使用 async/await 可以使代码看起来更像同步代码，从而使其更容易理解和修改。个优总之，使用使用 async/await 是​编步代编写高效、易于维护的写异秀实异步代码的关键。

下面是正文：

在这篇博客文章中，我们将讨论async/await - 一种在各种编程语言中编写异步代码的强大工具。

但首先，让我们定义async/await。简单来说，async/await是一种编写异步代码的方式，它看起来和行为像同步代码。它允许我们暂停函数的执行，等待 promise  解决，然后从离开的地方继续。

快速示例：

async function getData() { 
const response = await fetch('https://example.com/data');
const data = await response.json();
return data;
}

注意 fetch 和 response.json 的调用被包裹在 await 语句中。这使得函数在继续执行下一行之前暂停并等待 Promise 解决。

为什么 async/await 很重要

异步编程在当今高并发应用程序的世界中是必不可少的。无论是构建 Web 应用程序、移动应用程序还是后端服务，都有可能需要在某个时候使用 async/await。

改进的性能和可扩展性

async/await允许我们编写非阻塞代码，这意味着应用程序可以处理更多并发请求，而不会遇到性能瓶颈。

增强用户体验

async/await 可以帮助我们创建更具响应性和交互性的应用程序，从而带来更好的用户体验。

更好的代码结构和可读性

async/await 使编写干净有组织的代码更加容易，这在应用程序规模和复杂性增加时尤为重要。

提高生产力

通过简化异步编程，async/await 可以帮助我们在更短的时间内完成更多的工作。

Tips1: 对于所有异步代码，请使用 async/await

使用async/await处理所有异步代码是个好主意，原因有几个。首先，它可以促进代码库的一致性。通过使用async/await处理所有异步代码，我们将拥有一种一致的编写和组织代码的方式。这使得其他开发人员更容易理解和维护你的代码库。

async/await还可以使用 try/catch 块轻松捕获和处理错误。在处理 Promise 时，这尤其有用，因为如果没有适当的错误处理，Promise 可能很难调试。

最后，使用async/await在某些情况下可以提高性能，特别是与 await 关键字结合使用时。

以下是使用 async/await 处理所有异步代码的几个示例：

// Example 1: Using async/await with promises
async function getData() { 
try { 
const response = await fetch('https://example.com/data');
const data = await response.json();
return data;
} catch (error) { 
console.error(error);
}
}

// Example 2: Using async/await with async/await functions
async function processData(data) { 
try { 
const processedData = await transformData(data);
await saveData(processedData);
} catch (error) { 
console.error(error);
}
}

Tips2: 在 try/catch 块中使用 await 处理错误

处理错误是编写可靠且易于维护的代码的重要部分。在使用async/await时，最好在 try/catch 块内使用 await 关键字来正确处理错误。

下面是在 try/catch 块中使用 await 的示例：

async function getData() { 
try { 
const response = await fetch('https://example.com/data');
const data = await response.json();
return data;
} catch (error) { 
console.error(error);
}
}

在这个例子中， fetch 和 response.json 的调用被包含在 await 语句中，位于 try 块内。如果发生错误，它将被 catch 块捕获并记录到控制台。

在 async/await 代码中，使用 try/catch 块内的 await 是处理错误的简单有效方法。

Tips3: 避免在 async/await 中使用 .then() 和 .catch()

JavaScript中通常使用 .then() 和 .catch() 方法来处理 Promise。然而，当使用async/await时，通常最好避免使用 .then() 和 .catch() ，而是使用 try/catch 块。

这是一个使用 try/catch 块而不是 .then() 和 .catch() 的示例：

async function getData() { 
try { 
const response = await fetch('https://example.com/data');
const data = await response.json();
return data;
} catch (error) { 
console.error(error);
}
}

Tips4:  避免使用 async  void 函数，除了事件处理程序。

Async void 函数是使用 async 关键字标记的函数。虽然在某些情况下可以使用异步无返回值函数，但通常应避免使用。示例：

async void DoWork() { 
// Async code here
}

async void 函数可能会有问题，因为它们不返回值，这使得处理错误和确定函数何时完成变得困难。 通常最好使用  async Task 或  async Task<T> 函数。这些类型的函数允许我们返回值并更轻松地处理错误。

这是一个异步任务函数的示例：

async Task DoWork() { 
// Async code here
}

有一种情况可以使用 async void 函数：事件处理程序。async void 事件处理程序通常用于 UI 编程，以执行异步操作而不阻塞 UI 线程。

这是一个 async void 。

private async void Button_Click(object sender, RoutedEventArgs e) { 
// Async code here
}

Tips5: 不要在没有适当考虑的情况下混合使用同步和异步代码

混合同步和异步代码可能会导致许多问题，包括性能问题、死锁和竞争条件。通常最好避免混合同步和异步代码，除非你有充分的理由这样做。

有一些情况下，混合使用同步和异步代码是可以的：

• 当我们需要从同步方法调用异步方法时：在这种情况下，可以使用 await 关键字暂停同步方法并等待异步方法完成。
• 当我们需要从异步方法调用同步方法时：在这种情况下，可以使用 Task.Run() 方法在单独的线程上执行同步方法。

以下是从同步方法调用异步方法的示例：

public void DoWork() { 
// Sync code here
await DoAsyncWork();
// Sync code here
}

public async Task DoAsyncWork() { 
// Async code here
}

以下是从异步方法调用同步方法的示例：

public async Task DoAsyncWork() { 
// Async code here
await Task.Run(() => DoSyncWork());
// Async code here
}

public void DoSyncWork() { 
// Sync code here
}

除非有特定的原因，否则通常最好避免混合使用同步和异步代码。混合使用同步和异步代码可能会导致性能问题、死锁和竞争条件。但是，在某些情况下，有必要混合使用同步和异步代码，例如从同步方法调用异步方法或从异步方法调用同步方法。在混合使用同步和异步代码时，重要的是要正确处理错误并考虑对性能和可维护性的潜在影响。

本文转载自微信公众号「大迁世界」，可以通过以下二维码关注。转载本文请联系大迁世界公众号。

责任编辑：姜华 来源： 大迁世界 asyncawait

(责任编辑：热点)