async/await 中的 try/catch

褰辩话发布于2019-08-21 17:24 / 407人阅读

摘要：定时器为状态声明的函数配合按步骤自动执行类型自动执行器执行或者，使用捕获异常若是状态，抛出异常，函数体内的捕获

async/await 中的try/catch

es6中的async是异步编程的终极解决方案，近期学习了一下，相对于 generator 来说，具有更好的特性：内置执行器、更好的语义、更好的适用性，需要注意一点的是 await 后面是promise 对象或者原始类型的值。
更有意思的是可以使用 try/catch 来捕获异步中出现的异常

async/await中的 try/catch

// 定时器
function timer(params) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            // resolve("resolve");
            reject("reject");
        }, params);
    })
}

// async/await
async function fn(params) {
    try {
        var value = await timer(params);
    } catch (error) {
        console.log(error);        
    }
}

fn(1000); //执行

promise的状态变为 rejected 之后会跳转到 catch

内部实现

看了阮一峰老师的博客后，恍然大悟，原来是用 Generator.prototype.throw 和
Generator.prototype.next 来实现自动执行及异常抛出。

// 定时器
function timer(params) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            // resolve("resolve");
            reject("reject"); // next.value 为 rejected 状态
        }, params);
    })
}

// aysnc 声明的函数
function fn(args) {
    return spawn(function* () { // 配合 next 按步骤自动执行
        try {
            yield timer(args); // timer Promise类型
        } catch (error) {
            console.log(error);
        }
    });
}

// 自动执行器
function spawn(genF) {
    return new Promise(function (resolve, reject) {
        var gen = genF();

        function step(nextF) {
            try {
                var next = nextF(); // 执行 gen.next 或者 gen.throw ，使用 try/catch 捕获异常
            } catch (e) {
                return reject(e);
            }
            if (next.done) {
                return resolve(next.value);
            }
            Promise.resolve(next.value).then(function (v) {
                step(function () {
                    return gen.next(v);
                });
            }, function (e) {
                step(function () {
                    return gen.throw(e); // 若 next.value 是 rejected 状态，抛出异常，函数体内的try/catch捕获
                });
            });
        }
        step(function () {
            return gen.next(undefined);
        });
    });
}


fn(100).then(function (data) {
    console.log(data)
}).catch(function (error) {
    console.log(error);
})

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89482.html

如何优雅地处理Async/Await的异常？

摘要：能够捕获非异步的异常。来匹配正常异常的情况。在中处理所有的异常如果出错，则退出。所以，的模式使得异常处理变得非常简洁。自从年双十一正式上线，累计处理了亿错误事件，付费客户有阳光保险核桃编程荔枝掌门对微脉青团社等众多品牌企业。译者按：使用.catch()来捕获所有的异常原文: Async Await Error Handling in JavaScript 译者: Fundeb...

villainhr 2019-08-26 10:19 评论0 收藏0
从不用 try-catch 实现的 async/await 语法说错误处理

摘要：像这种中断式的错误处理，其实正适合采用。然而注意，上面的代码中并没有直接使用，而是使用了自定义的错误消息。所以需要对出来的进一步处理成指定的错误消息。前不久看到 Dima Grossman 写的 How to write async await without try-catch blocks in Javascript。看到标题的时候，我感到非常好奇。我知道虽然在异步程序中可以不使...

0xE7A38A 2019-08-22 11:14 评论0 收藏0
ES6 系列之我们来聊聊 Async

摘要：标准引入了函数，使得异步操作变得更加方便。在异步处理上，函数就是函数的语法糖。在实际项目中，错误处理逻辑可能会很复杂，这会导致冗余的代码。的出现使得就可以捕获同步和异步的错误。如果有错误或者不严谨的地方，请务必给予指正，十分感谢。 async ES2017 标准引入了 async 函数，使得异步操作变得更加方便。在异步处理上，async 函数就是 Generator 函数的语法糖。 ...

Songlcy 2019-08-23 12:30 评论0 收藏0
JS 异步错误捕获二三事

摘要：以及异步代码在中是特别常见的，我们该怎么做才比较无法捕获的情况这段代码中，的回调函数抛出一个错误，并不会在中捕获，会导致程序直接报错崩掉。用捕获异步错误把异步操作用包装，通过内部判断，把错误，在外面通过捕获。引入我们都知道 try catch 无法捕获 setTimeout 异步任务中的错误，那其中的原因是什么。以及异步代码在 js 中是特别常见的，我们该怎么做才比较？无法捕获的...

Java_oldboy 2019-08-23 17:07 评论0 收藏0