async 和 await 实现原理

简单实现

function request(data) {
    return new Promise(resolve => {
        setTimeout(() => resolve(data + '-done'), 100)
    })
}


// ========== async/await 版本 ==========
async function runAsync() {
    const res = await request('11')
    const res2 = await request(res)
    console.log(res2)
}


// ========== Generator 模拟版本 ==========
function* generate() {
    const res = yield request('11')      // 第1次 yield，等待外部传入结果
    const res2 = yield request(res)       // 第2次 yield
    console.log(res2)
}

function runGenerator() {
    const g = generate()
    function exec(prevValue) {            // ← 接收上一次的结果
        const { value, done } = g.next(prevValue)  // ← 传回生成器内部
        if (!done) {
            // value 是 Promise，resolve 后继续执行
            value.then(res => exec(res))  // ← 递归执行，形成"伪同步"
        }
    }
    
    exec()  // 第一次启动，不传值
}

// 测试
runGenerator()

更完整的实现（类似 co 库）

function co(genFn) {
    return new Promise((resolve, reject) => {
        const g = genFn()
        
        function step(value) {
            let result
            try {
                result = g.next(value)
            } catch (e) {
                return reject(e)
            }
            
            if (result.done) {
                return resolve(result.value)
            }
            
            Promise.resolve(result.value).then(
                val => step(val),
                err => g.throw(err)  // 错误处理
            )
        }
        
        step()
    })
}

// 使用
co(function* () {
    const res = yield request('11')
    const res2 = yield request(res)
    return res2
}).then(console.log)