Deno 中的 await 使用规范与注意事项-JavaScript中文网-JavaScript教程资源分享门户

Deno 是一个新兴的 JavaScript 运行时环境，它提供了一种更加安全、稳定和可靠的方式来编写和运行 JavaScript 代码。在 Deno 中，我们可以使用 await 关键字来等待异步操作完成，这样可以让我们的代码更加简洁、易读和易于维护。然而，在使用 await 关键字时，我们也需要遵循一些规范和注意事项，以确保我们的代码能够正确地工作。

await 关键字的使用规范

在 Deno 中，我们可以使用 await 关键字来等待异步操作完成，例如：

const result = await fetch('https://api.github.com/users/octocat');

在这个例子中，我们使用 await 关键字来等待 fetch 函数返回结果。在这个过程中，JavaScript 引擎会暂停当前函数的执行，直到 fetch 函数返回结果。当 fetch 函数返回结果后，我们可以通过 result 变量来访问返回的数据。

在使用 await 关键字时，我们需要遵循以下规范：

1. await 关键字只能在 async 函数中使用

在 Deno 中，我们只能在 async 函数中使用 await 关键字。如果我们在普通函数中使用 await 关键字，JavaScript 引擎会抛出 SyntaxError 错误。

function fetchData() {
  const result = await fetch('https://api.github.com/users/octocat'); // SyntaxError: await is only valid in async function
}

2. await 关键字后面必须是一个 Promise 对象

在使用 await 关键字时，我们需要确保 await 后面的表达式返回一个 Promise 对象。如果 await 后面的表达式不是一个 Promise 对象，JavaScript 引擎会抛出 TypeError 错误。

function fetchData() {
  const result = await 'hello world'; // TypeError: 'hello world' is not a Promise
}

3. await 关键字只能在 try-catch 语句中使用

在使用 await 关键字时，我们需要确保将其放在 try-catch 语句中，以便正确地处理 Promise 对象的 reject 状态。如果我们在没有 try-catch 语句的情况下使用 await 关键字，JavaScript 引擎会抛出 Uncaught (in promise) 错误。

async function fetchData() {
  const result = await fetch('https://api.github.com/users/octocat');
  console.log(result);
}

fetchData(); // Uncaught (in promise) TypeError: Failed to fetch

在这个例子中，我们没有使用 try-catch 语句来处理 fetch 函数返回的 Promise 对象的 reject 状态，导致 JavaScript 引擎抛出了 Uncaught (in promise) 错误。

await 关键字的注意事项

在使用 await 关键字时，我们还需要注意以下事项：

1. 不要在循环中使用 await 关键字

在循环中使用 await 关键字可能会导致性能问题。因为在每次循环中使用 await 关键字时，JavaScript 引擎都会暂停当前函数的执行，直到 Promise 对象返回结果。如果我们在循环中使用 await 关键字，这样会导致程序的执行速度变慢。

async function fetchData() {
  const urls = ['https://api.github.com/users/octocat', 'https://api.github.com/users/mojombo'];
  for (const url of urls) {
    const result = await fetch(url);
    console.log(result);
  }
}

在这个例子中，我们在循环中使用了 await 关键字，这样会导致程序的执行速度变慢。为了提高程序的执行速度，我们可以使用 Promise.all 方法来并行处理多个 Promise 对象。

async function fetchData() {
  const urls = ['https://api.github.com/users/octocat', 'https://api.github.com/users/mojombo'];
  const results = await Promise.all(urls.map(url => fetch(url)));
  console.log(results);
}

2. 不要在 Promise 对象的 then 方法中使用 await 关键字

在 Promise 对象的 then 方法中使用 await 关键字可能会导致代码的可读性变差。因为在使用 await 关键字时，我们会将异步操作的代码放在同步代码的位置，这样会让代码变得更加难以理解。

async function fetchData() {
  const result = await fetch('https://api.github.com/users/octocat');
  result.json().then(async data => {
    const repos = await fetch(data.repos_url);
    console.log(repos);
  });
}

在这个例子中，我们在 Promise 对象的 then 方法中使用了 await 关键字，这样会让代码变得更加难以理解。为了让代码更加清晰易懂，我们可以将异步操作的代码放在 async 函数中。

async function fetchData() {
  const result = await fetch('https://api.github.com/users/octocat');
  const data = await result.json();
  const repos = await fetch(data.repos_url);
  console.log(repos);
}

示例代码

下面是一个使用 await 关键字的示例代码：

// www.javascriptcn.com code example
async function fetchData() {
  try {
    const result = await fetch('https://api.github.com/users/octocat');
    const data = await result.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

fetchData();

在这个例子中，我们使用 await 关键字来等待 fetch 函数返回结果，并使用 try-catch 语句来处理 Promise 对象的 reject 状态。当 fetch 函数返回结果后，我们将其转换为 JSON 格式，并打印出来。如果出现错误，我们会将错误信息打印到控制台中。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/67d51bf3a941bf7134972a0a

Deno 中的 await 使用规范与注意事项