用代码举例说明async/await

好的，以下是一个简单的例子：

async function foo() {
  console.log('Before the promise');

  await new Promise(resolve => setTimeout(resolve, 1000)); // 等待1秒钟

  console.log('After the promise');
}

foo();

这段代码定义了一个异步函数 `foo`，其中包含了一个 `await` 表达式来等待一个 `Promise` 对象完成。在这个例子中，`foo` 函数会打印出 `Before the promise` 并等待 1 秒钟后再打印 `After the promise`。由于使用了 `async/await`，我们可以将异步代码写得更加直观和简洁。

相关问题

往一个数组里存了多个将要执行的函数，如何采用Promise、async/await方法遍历循环这个数组，用代码举例说明

可以使用async/await方法来遍历循环这个数组，代码如下：

const functions = [func1, func2, func3];

async function executeFunctions() {
  for (const func of functions) {
    await func();
  }
}

executeFunctions();

其中，`functions`是存储多个将要执行的函数的数组，`executeFunctions`是一个异步函数，使用`for...of`循环遍历`functions`数组，每次执行一个函数，并使用`await`关键字等待该函数执行完毕后再执行下一个函数。最后，调用`executeFunctions`函数即可执行整个数组中的函数。

vue中的async await用法举例说明

当在Vue中使用async/await时，可以在异步函数中进行等待操作，以便在异步操作完成后继续执行其他代码。下面是一个示例：

<template>
  <div>
    <button @click="fetchData">Fetch Data</button>
    <p v-if="loading">Loading...</p>
    <ul v-if="!loading">
      <li v-for="item in data" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [],
      loading: false
    };
  },
  methods: {
    async fetchData() {
      try {
        this.loading = true;
        const response = await this.$axios.get('https://api.example.com/data');
        this.data = response.data;
        this.loading = false;
      } catch (error) {
        console.error(error);
        this.loading = false;
      }
    }
  }
};
</script>

在上面的示例中，我们定义了一个名为`fetchData`的方法，该方法使用`async`关键字将其标记为异步函数。在方法内部，我们首先设置`loading`状态为`true`，以便显示加载提示。

然后，我们使用`await`关键字等待异步操作的完成。在这个例子中，我们使用了Vue的插件`$axios`来发送HTTP请求，并获取数据。注意，我们使用`try...catch`块来捕获可能发生的异常。

一旦异步操作完成，我们将获取到的数据赋值给`data`属性，并将`loading`状态设为`false`，以便隐藏加载提示。如果出现错误，我们将错误信息打印到控制台，并将`loading`状态设为`false`。

通过使用async/await，我们可以更清晰地编写异步代码，并处理异步操作的结果。