在过去的几年中 我有时需要调用一些JavaScript代码来执行一些特定的操作。
在这种情况下，我从不使用特定的JavaScript框架，在Vanilla JavaScript中必须执行许多功能。

如果您曾经在JavaScript中使用异步代码，则可能知道处理回调，承诺和错误的挑战性。幸运的是，有一个句法功能可以使您的生活更轻松：异步和等待。

异步和等待的关键字是使您可以以更可读和简洁的方式编写异步代码。它们是基于承诺的，但是它们让您避免当时的嵌套和链接（）和catch（）方法。取而代之的是，您可以使用等待的关键字暂停执行异步功能，直到解决或拒绝承诺为止。这样，您可以编写异步代码，就好像它是同步的。

如何使用异步和等待

要使用异步和等待，您需要做两件事：

• 在功能名称或箭头函数之前使用异步关键字声明异步函数。
• 使用异步函数中的等待关键字等待解决或拒绝的承诺。

这是异步函数的一个简单示例，该函数从API中获取了一些数据并将结果记录到控制台中：

async function fetchData() {
  let response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
  let data = await response.json();
  console.log(data);
}

// Call the async function
fetchData();

注意代码看起来像同步代码，即使它执行异步操作。等待的关键字使JavaScript引擎暂停了异步功能的执行，直到承诺解决为止。然后，它以承诺的解决值恢复执行。

您也可以使用尝试...捕获块来处理异步函数中的错误，就像在同步代码中一样。例如：

async function fetchData() {
  try {
    let response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
    let data = await response.json();
    console.log(data);
  } catch (error) {
    // Handle the error
    console.error(error);
  }
}

异步和等待的优点

使用异步并等待您的代码质量和可读性可以有几个好处：

• 它减少了使用承诺和回调随附的样板代码和凹痕。
• 它使代码更加线性和直观，因为它遵循执行的自然流动。
• 它可以改善错误处理，因为您可以使用标准尝试...捕获块而不是catch（）方法或拒绝回调。
• 它可以更轻松地调试代码，因为您可以使用断点并逐步浏览代码，就像同步一样。

异步和等待

虽然异步和等待是非常有用和有力的功能，但它们也有一些警告，您应该注意：

• 您只能在异步函数中使用等待。如果您尝试在异步函数之外使用它，则会获得语法错误。
• 异步函数始终返回承诺，即使您不明确返回一个函数。这意味着您需要使用（）或等待通过异步函数返回的值。
• 使用等待将阻止当前异步函数的执行，但不能阻止整个程序的执行。其他不依赖期待承诺的功能或事件仍将在后台运行。
• 您应该避免在循环或并行任务中使用等待，因为它会使您的代码顺序运行而不是同时运行。相反，您应该使用Promise.All（）或Promise.race（）一次等待多个承诺。

您可以找到有关Promise.ly.ly（）和Promise.race（）here的更多信息。

结论

异步和等待可以提高您的代码质量和可读性，以及您的错误处理和调试体验。但是，它们还需要注意一些警告，例如仅在异步功能中使用它们，正确处理其返回值，并避免在循环或平行任务中避免它们。

如果您想了解有关异步和等待的更多信息，则可以查看以下链接：MDN Web Docs: Async functions

您是否有兴趣学习github，但不知道从哪里开始？尝试我的LinkedIn学习课程：Learning GitHub。

感谢您阅读这篇文章，希望您发现它很有趣！

随时关注我，当新文章不在ð