vue 判断 async function

首先，async function 是 ES2017 引入的一个新特性，它使得异步编程变得更加简单和直观。async function 可以让我们使用 await 关键字来暂停函数的执行，等待一个 Promise 对象被 resolve，然后拿到这个 Promise 对象的返回值。同时，async function 也会把函数体中的代码封装成一个 Promise 对象，使得返回值的处理更为方便。

在 Vue 的开发中，我们很可能会遇到 async function 的使用情况，例如在组件的生命周期函数中需要发送异步请求获取数据。判断 async function 可以通过以下两种方法实现：

1. 使用 instanceof 判断

在 JavaScript 中，async function 返回的是一个 Promise 对象，因此我们可以通过使用 instanceof 来判断一个函数是否为 async function：

function isAsyncFunction(fn) {
  return fn instanceof Promise.constructor;
}

// test case
async function fn() {
  console.log('Hello');
}

console.log(isAsyncFunction(fn));  // true
console.log(isAsyncFunction(() => {}));  // false

在上面的代码中，我们定义了一个 isAsyncFunction 函数来判断一个函数是否为 async function，这个函数使用 instanceof 来判断函数是否为 Promise 的实例。在 test case 中，我们分别测试了一个 async function 和一个普通函数，结果表明确实判断正确。

2. 判断函数的属性

我们也可以通过判断函数的属性来判断一个函数是否为 async function。具体来说，我们可以通过查看一个函数是否含有 async 和 await 关键字来判断它是否为 async function，代码如下：

function isAsyncFunction(fn) {
  const fnString = fn.toString();
  return /async/.test(fnString) && /await/.test(fnString);
}

// test case
async function fn() {
  console.log('Hello');
}

console.log(isAsyncFunction(fn));  // true
console.log(isAsyncFunction(() => {}));  // false

在上面的代码中，我们定义了一个 isAsyncFunction 函数来判断一个函数是否为 async function，这个函数使用 toString() 方法来将函数转换成字符串，然后使用正则表达式来判断字符串中是否包含 async 和 await 关键字。在 test case 中，我们分别测试了一个 async function 和一个普通函数，结果表明确实判断正确。

总结

无论是 instanceof 还是判断函数属性，我们都可以很容易地判断一个函数是否为 async function。在 Vue 的开发中，我们可以通过这个特性来优雅地处理异步操作，提高开发效率和代码可维护性。