https://zhuanlan.zhihu.com/p/24684803
(一)理解promises
举个简单例子:
想象你是一个孩子。你老妈承诺下礼拜 给你买个新手机。你 [不知道] 你是否会得到手机直到下礼拜。你老妈可以真的买你一个全新的手机,也可以让你滚蛋并告诉你不买了(如果她不高兴了)。
这是一个承诺。一个承诺有3个状态。分别是:
1.悬而未决:你 [不知道] 你是否会得到手机直到下礼拜。 pending
2.解决:你老妈可以真的买你一个全新的手机。fulfilled
3.拒绝:你老妈拒绝给你买,因为你惹她不高兴。rejected
(二)创建一个promise
- “isMomHappy”是个布尔值,定义老妈是否开心。
- “willIGetNewPhone”是一个promise,这个承诺可以解决(给你买),也可以拒绝(老妈不开心就不给你买)。.
- 还有一个标准语法去定义一个新的promise,参考MDN documentation,看下面代码:
需要记住的是,在你定义的promise里,当结果是成功的,叫 解决(你的成功值),如果结果失败了,叫 拒绝(你的失败值)。
在我们的例子中,如果老妈高兴,我们会得到一个电话。因此,我们称 resolvefunction(电话变量)。如果老妈不高兴,我们称为 拒绝函数(拒绝的理由);
(三)玩转promises
现在有了promise,咱们就开始玩一玩。
我们有一个函数“askmom”。在这个函数中,我们将使用我们的承诺“ willigetnewphone”。
当我们的promise是解决或者拒绝的时候,我们要做点事儿,我们用“.then & .catch ”来处理我们的行动;
在“.then”里面有函数“ function(fulfilled) { ... } ”。这个函数的返回值是啥呢?返回值是promise解决的值(你的成功时候的值);在我们的案例中它是一部新电话 。
在 ".catch"里面有函数"function(error){ ... } "。猜测一下,其实这个返回的是错误值,就是promise拒绝的值。
(四)链接promises
Promises都是可链的。
这样说吧,你,咱例子中的孩子,承诺给你的朋友说:如果你老妈给你买了新手机,就让你的朋友过过眼瘾,你要显摆显摆!
这又是另外一个promise了,写成代码看下!
注意:
在这个例子中,你可能会意识到我们不叫 拒绝。因为它是可选的。
我们可以缩短这个案例,看代码:
咱们现在链接promise。你,这个孩子只能在得到手机后才能显摆手机。
(五)promises都是异步的
Promises都是异步的,咱们在这个promise开始和结束前写一段信息。
你,孩子,不会说不去玩了就干等你老妈的承诺(新手机),对吧。这就是 异步调用,代码将无阻塞运行或等待结果。任何需要等promise的行为放在".then"里面。
ES6 - 现代浏览器
ES7 - 异步等待使语法看起来更漂亮!
ES7介绍 异步 和 等待 语法。它使异步语法看起来更漂亮、更容易理解,没有 ".then" 和".catch"。
当你需要在一个函数里面返回一个promise,你在异步 调用这个函数。例如 案例中的异步函数"function showOff(phone)"。
当你需要一个promise,你就在等待着 。例如 "let phone = await willIGetNewPhone;" & " let message = await showOff(phone)"。
使用 " try { ... } catch(error) { ... } " 捕捉promise错误/拒绝 。
新家伙:Observables观测值
在promise已经让你很幸福的时候,Observables这货来锦上添花,让处理异步数据量更容易。
Observables是懒惰的事件流,可以发出零个或多个事件,而且可能完成也可能不完成。
promise和observable的关键区别是:
Observables观测值是可以取消的
Observable是懒惰的