资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/ES6 Promise——then与catch的返回值实践

ES6 Promise——then与catch的返回值实践

omgdog / 1906人阅读

摘要：值的情况返回的会成为状态。再次重复这一句话为的语法糖，它是的别名。也就是说，也是，它用于捕获错误，它的参数也就是是的第二个参数。所以，假设中如果值的话，新的对象也会是接受状态。

以下是在学习Promise关于catch与then的疑惑总结

一.catch为then的语法糖

故then方法与catch方法均会返回一个Promise对象（对，即使return 为某个值，或者throw error，或者不返回值）
我们来看看MDN的定义，这里可能为了严谨而说得有点乱七八糟的

简单来说，就是分为return 值（无return的情况下即返回undefined，也是返回值），throw error， return Promise

二.说说return值与throw error的情况。 1.return 值的情况：

返回的Promise会成为Fulfilled状态。
return的值会作为新Promise对象下一个then的回调函数的参数值，贴代码看例子

var example = new Promise((fulfill, reject)=>{
    let i = 1;
    fulfill(i);
})
example
.then((value)=>{ console.log(value); value++; return value;  })
.then((value) => {console.log(value);                        });

输出结果如下：

调用fufill函数return value会传给下一个回调函数
回到上面的疑问，如果没有return呢，那么就会返回undefined
(就是函数无return返回的是undefined的情况，基础要扎实啊啊啊)

var example = new Promise((fulfill, reject)=>{
    let i = 1;
    fulfill(i);
})
example
.then((value)=>{ console.log(value); value++; })
.then((value) => {console.log(value);});

输出结果如下：

2.throw error的情况：

返回的Promise会成为Rejected状态，
下一步执行catch中的回调函数或者then的第二个回调函数参数

这里出现了之前一直搞混的东西。
再次重复这一句话：catch为then的语法糖，它是then(null, rejection)的别名。
也就是说，catch也是then，它用于捕获错误，它的参数也就是是then的第二个参数。
所以，假设catch中如果return 值的话，新的Promise对象也会是接受状态。
看看例子：

var example = new Promise((fulfill, reject)=>{
    let i = 1;
    reject(i);
})
example
.catch(()=>{console.log("我是第一个catch的回调函数"); return 1;})
.then(() =>{console.log("我是第一个then的回调函数");    throw Error    })
.catch(()=>{console.log("我是第二个catch的回调函数")})
.then(() => {console.log("我是第二个then的回调函数")})

结果如下图：

调用reject函数后，promise变为rejected状态，故执行第一个catch的回调函数
第一个catch的回调函数return 1，故执行第一个then的回调函数
第一个then的回调函数throw Error，故执行第二个catch的回调函数
第二个catch的回调函数ruturn undefined（如上文所言），故执行第二个then的回调函数

3.return Promise的情况

至于return Promise的情况下，其实同理啦，我只是刚开始接触Promise语法时感到不是很适应：竟然会自动为你生成Promise对象？！后来看了部分源码剖析后才大致知道为什么会这样子，链接也放下面吧

链接：
MDN：catch：https://developer.mozilla.org...
MDN：then：https://developer.mozilla.org...
Promise实现：https://tech.meituan.com/prom...

GPU云服务器 云服务器 es6中的promise 指针函数的返回值 java查询的返回值 java递归的返回值

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

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

相关文章

  • ES6 Promise：模式与反模式

    摘要：尽管可以让代码更加简洁易读，但对于只熟悉回调函数的人来说，可能对此还是会有所怀疑。始终避免在或使用回调函数，否则会吞噬任何后续的错误，将其作为链的一部分。然而，使用回调函数，使用所谓的，即第一个参数是一个错误回调变得很常见。 原文：ES6 Promises: Patterns and Anti-Patterns作者：Bobby Brennan 当几年前，第一次使用 NodeJS 的时候...

    djfml 评论0 收藏0

  • es6 - Promise

    摘要：所谓异步编程中的异步是相对于同步的概念的。是一系列异步编程规范的统称。如果中的回调函数返回一个值，那么返回的将会成为接受状态，并且将返回的值作为接受状态的回调函数的参数值。参考介绍基础篇深入理解与异步编程。 es6 promise与异步编程 对于一些还不具备大量编程经验的朋友来说，promise可能是es6比较难以掌握的点。首先是很多名词，比如Promises，es6 Promise,...

    wemallshop 评论0 收藏0

  • JavaScript工作原理（四）：事件循环，异步编程的兴起以及5招async/await实践

    摘要：事件循环从回调队列中获取并将其推送到调用堆栈。如何工作请注意，不会自动将您的回调函数放到事件循环队列中。它设置了一个计时器，当计时器到期时，环境将您的回调函数放入事件循环中，以便将来的某个事件会将其选中并执行它。 我们将通过回顾第一篇文章中单线程编程的缺点，然后在讨论如何克服它们来构建令人惊叹的JavaScript UI。在文章结尾处，我们将分享5个关于如何使用async / awai...

    piglei 评论0 收藏0

  • 【个人向整理】Promise

    摘要：方法而对象本身，有一些方法查看的原型，发现它内置有几个方法参数处理成功的函数，处理错误的函数返回值返回一个对象，所以可以链式调用。参数返回值的参数应该是函数，传入非函数则会发生值穿透。 前言 网上关于Promise的文章确实是非常多了，但是自己实践的并不多，这里是针对自己的一个知识点小结和梳理，当然啦如果有错误欢迎提出^_^。 初定义 定义：Promise对象用于一个异步操作的最终完成...

    2bdenny 评论0 收藏0

  • 这次聊聊Promise对象

    摘要：异步模式编程有四种方法回调函数最基本的方法，把写成的回调函数事件监听为绑定事件，当发生某个事件，就执行发布订阅，以及本文要介绍的对象。它的思想是，每一个异步任务返回一个对象，该对象有一个方法，允许指定回调函数。 欢迎大家前往腾讯云+社区，获取更多腾讯海量技术实践干货哦~ 本文由前端林子发表于云+社区专栏 Promise是CommonJS提出的一种规范，在ES6中已经原生支持Promi...

    Eminjannn 评论0 收藏0

发表评论

登陆后可评论

0条评论

omgdog

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<