写在前面

晚上睡不着，决心还是起来把今天白天工作期间反问一个小伙伴的async&await问题。实际上这个问题之前我就一直想写点什么，只是奈何懒的很，一直没有行动。今天还是忍不住想要吐糟一下，如果有什么说得不对的，欢迎批评指证！

前端项目中异步函数存在的问题

在现在的前端项目中，充斥这大量的异步操作，由于async & await的兴起，导致我今天看到小伙伴有一个项目的代码大量充斥着try catch,代码大概如下：

function request(type) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            type === 'a' ? resolve('resolve') : reject('reject')
        }, 2000);
    })
}

async function getData() {
    try {
        let ret1 = await request('a');
    }catch(error){
        // todo 
    }

    try {
        let ret2 = await request('b');
    } catch (error) {
        // todo
    }

    try {
        let ret3 = await request('c');
    } catch (error) {
        // todo
    }
}
getData();

解决办法

在复杂的业务中，这种充斥很多的try catch我实在受不了。势必会想办法解决一下这个问题。 首先需要明确的是 await 后面的promise只有是一个resolve状态，才能正确的拿到其结果。那么要解决这个问题，势必要让异步返回一个resolve状态，但是错误我们不能视而不见，结合nodejs中错误优先，我们可以将错误和结果封装成一个数组返回，那么就有了如下代码了：

/**
 * 高级的处理,接收一个promise，返回一个resolve状态的promise
 * 
 * @param {*} promise 
 */
const hRequest = promise  => promise.then(res => [undefined, res]).catch(err => [err,undefined])


async function getData2() {
    let err,result;
    [err,result] = await hRequest(request('a'));
    console.log(err,result);
    [err,result] = await hRequest(request('b'));
    console.log(err,result);
}
getData2();

最后

经过这样一转换，你可以优先判断有没有错误，然后再处理你的业务。