疑问：能否仅用async函数实现含setTimeout的异步逻辑（无需new Promise）？

先看你原来add3函数的核心问题：

const add3 = async () =>  {
    setTimeout(() => {
        x = [...x, 3]
        return Promise.resolve()
    }, 4000)
}

这个async函数里，setTimeout是异步回调，但async函数会在同步代码执行完后立刻返回一个resolved状态的Promise——你既没在函数里返回任何Promise，也没await任何异步操作。回调里的return Promise.resolve()完全无效，它根本不会影响async函数返回的Promise状态。所以await add3()会瞬间执行完成，后续的console.log(x)在4秒前就跑完了，自然看不到添加3后的数组。

只用async函数实现的方案 #

async函数本身是Promise的语法糖，要处理setTimeout这种回调式异步操作，必须把它封装成Promise，但可以把封装逻辑放在async函数内部，不用单独写一个返回Promise的独立函数：

var x = [1]

const add2 = async () => {
    x = [...x, 2]
    return Promise.resolve()
}

const add3 = async () =>  {
    // 在async函数内部用Promise包裹setTimeout逻辑
    await new Promise((resolve) => {
        setTimeout(() => {
            x = [...x, 3]
            resolve()
        }, 4000)
    })
}

const final = async () => {
    console.log(x)
    await add2()
    console.log(x)
    await add3()
    console.log(x)
}

final()

这个写法里，add3是标准的async函数，内部通过await等待封装了setTimeout的Promise完成。这样await add3()会等待4秒，直到x被修改后才继续执行后续代码，就能得到预期的[1,2,3]输出。

为什么不能完全脱离Promise？ #

setTimeout是传统的回调式API，本身不返回Promise。而await只能等待Promise（或thenable对象），所以必须把回调式异步操作转换成Promise，才能被async/await正确处理。async函数只是Promise的语法糖，底层逻辑依然依赖Promise。

内容的提问来源于stack exchange，提问作者Vivek Y V