摘要：作者珂珂沪江前端开发工程师本文为原创文章，有不当之处欢迎指出。只对未来发生的事情做出两种基本情况的应对成功和失败。在异步转同步这条道路上，只是一个出彩的点，他还尚有一些缺陷和不足，并不是我们最终的解决方案。
作者：珂珂 （沪江前端开发工程师）
本文为原创文章，有不当之处欢迎指出。转载请标明出处。
一个新事物的产生必然是有其历史原因的。为了更好的以同步的方式写异步的代码，人们在JS上操碎了心。从Deferred到Promise到Generator再到Async和Await，各种工具的涌现就像是人类文明的进化史，从无到有，从简陋到完善。
在这其中，Promise是较为重要的一个工具，也是后面不同工具进化完善的基石，今天我们就来了解一下：我们为什么需要Promise以及Promise为我们解决了什么问题。
我们需要什么？ 1. 回调地狱我们应该都遇到过这样的代码：
callback嵌套函数层数少了还好，如果更多的话，大量的缩进会你的代码慢慢地向屏幕右侧移动。如果你写了几十层回调，那么你的代码在一个屏幕的宽度上可能放不下了。这会让我们的代码变得难以维护，像一坨*。诚然我们可以通过其它的方式，把代码抽出来平级对待，例如：
这么做虽然好看了，但： 1. 切断了我们代码结构上的层级串联，而是采用了非结构的指向串联 ，跳来跳去的函数引用，很可能就把我们绕晕了 2. 要耗费更多的时间来整理代码
我们想要的是：既能串起来写，又能少花时间。而Promise恰恰解决了这么一个痛点。
var promise = new Promise(...); promise.then(...) .then(...) .then(...) .then(...) .catch(...)
对！我们其实要的就是这样一种“语法糖”。
2. 不让回调里的return和throw变成摆设想想你在$.ajax()的success回调里写个return xxx，没啥用，return给谁？这种感觉就像打了一记空拳。另外，你如果在异步回调里throw一个错误，外面想接一下，比如你想这样:
恭喜你！接不到，error被扔到全局环境里去了，BOOM！然后主线程就挂了。
Promise解决方案是什么？首先在字面意思上看Promise，翻译成“承诺”的话有些抽象。那么具象一点，我们可以把Promise看成某种“合约”的管理者和执行者。
对，我们可以先把“他”想象成一个人，给他起一个简短的名字，叫做：“P先生”。下面，就来看一下，“P先生”是如何帮助我们解决问题的（由于解决方案是“P先生”提供的，所以我们需要按照“他”的套路来）。
1. 定下合约首先，我们需要按照某个模板的样子写下一个“合约”，“合约”里告诉“P先生”的是将来可能发生的事情，“P先生”针对我们和“他”约定的事项，做不同的处理和反馈。Promise只对未来发生的事情做出两种基本情况的应对：“成功” 和 “失败”。
上述代码中，首先我们召唤(new)了一个“P先生”，然后在回调函数里告诉了“他”具体的合约内容，合约规定：在setTimeout异步操作中，如果得到的秒数大于30s，则合约生效并且完成；否则的话，合约无效并且完成。“P先生”点点头说：“好的，没问题”。
注意：一旦做完resolve或者reject操作，合约的状态就算定死了，没办法再改动了。
2. 合约完成后的操作上一步做完，“P先生”只会告诉我们合约完成的结果：成功 或 失败。那么成功后该怎么做？失败后该怎么做？我们还没有告诉“P先生”，下面挥一挥小手（引用promise变量），把“P先生”招过来，继续嘱咐：
then给出了应对成功或失败具体需要的方案，里面需要传两个处理函数
如果then中只传递了onRejected函数的话，那么相当于catch。
看到这里，我们发现Promise一定程度上帮我们解决了错误捕获的问题。上述例子，我们在then链中产生的错误，最后都能被catch捕捉到（前提是你在最后面写了catch）。
then里面的函数该写点什么？每一个 promise 都会提供给你一个 then()函数。当我们的代码跑在 then()函数内部时，是这样子的：
在这个函数内部我们可以做什么呢？
也就是说我可以这么写:
在上面的例子中看到，我们能在then中愉快的使用return和throw，并顺利将值传递给下一层then或catch来处理。到这里Promise其实已经解决了之前我们说过的问题：“在异步回调里不能有效的使用return和throw”
总结看到这里，想必各位看官应该已经清楚的认识到Promise是个什么东西，并帮助我们解决了什么问题吧？当然，Promise API还提供了很多的方法，比如race, all，reject, resolve。本文的主要目的还是为了解释Promise产生的原因和“他”解决了什么问题，至于API上的其它方法，相信在理解Promise的基础上，会很容易就掌握的。
在异步“转”同步这条道路上，Promise只是一个出彩的点，“他”还尚有一些缺陷和不足，并不是我们最终的解决方案。下一次，我们将一起学习新的工具：Generator！
参考资料：【翻译】We have a problem with promises
JavaScript Promise迷你书（中文版）
ES6 JavaScript Promise的感性认知
Promise - JavaScript | MDN
iKcamp原创新书《移动Web前端高效开发实战》已在亚马逊、京东、当当开售。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/85121.html
摘要：三是控制反转控制权在其他人的代码上，假如异步函数是别人提供的库，我们把回调函数传进去，我们并不能知道异步函数在调用回调函数之外做了什么事情。错误捕捉相比回调函数的错误无法在外部捕捉的问题，能够为一连串的异步调用提供错误处理。 前言 《JS异步编程之 callback》一文我们了解了JS 是基于单线程事件循环的概念构建的，回调函数不会立即执行，由事件轮询去检测事件是否执行完毕，当执行完有...
摘要：今天要介绍的是，就是回调函数与间的桥梁。什么样的叫有两个条件回调函数在主函数中的参数位置必须是最后一个回调函数参数中的第一个参数必须是。 作者：晃晃本文原创，转载请注明作者及出处 Promise 自问世以来，得到了大量的应用，简直是 javascript 中的神器。它很好地解决了异步方法的回调地狱、提供了我们在异步方法中使用 return 的能力，并将 callback 的调用纳入了自...
摘要：如果过程中遇到引擎执行会被挂起线程，更新保存在一个队列中等待引擎空闲才执行引擎线程负责解析运行执行时间过程会导致页面渲染加载阻塞事件触发线程，浏览器用以控制事件循环。 序 总所周知，javascript是一门依赖宿主环境的单线程的弱脚本语言，这意味着什么？ javascript的运行环境一般都由宿主环境（如浏览器、Node、Ringo等）和执行环境（Javascript引擎V8，Ja...
摘要：浏览器与的异同，以及部分机制有人对部分迷惑，本身构造函数是同步的，是异步。浏览器的的已全部分析完成，过程中引用阮一峰博客，知乎，部分文章内容，侵删。 浏览器与NodeJS的EventLoop异同，以及部分机制 PS：有人对promise部分迷惑，Promise本身构造函数是同步的，.then是异步。---- 2018/7/6 22：35修改 javascript 是一门单线程的脚本...
阅读 1514·2021-10-11 10:59
阅读 2288·2021-09-30 09:53
阅读 1546·2021-09-22 15:28
阅读 2687·2019-08-29 15:29
阅读 1445·2019-08-29 13:53
阅读 3068·2019-08-29 12:34
阅读 2742·2019-08-26 10:16
阅读 2526·2019-08-23 15:16
