理解 ES6 中的 Promise
<p style="text-align: center;"><img src="https://simg.open-open.com/show/021519e804bff3171d0e95f752c458fa.jpg"></p> <p>这篇文章我尝试从感性的角度来理解一下 Promise,举一个栗子。</p> <p>小明来到火车站,跟售票员说:“我要一张广州到杭州的高铁票”,售票员说:“你等等,我查一下!”</p> <p>上面这个场景,售票员对小明说的这句话就是一个 “承诺” ,告诉小明,我会替你查一下,看看有没有,如果有余票,就告诉你有,没有就告诉你没有。</p> <p>那么,小明是怎么得到这个 “承诺” 的呢?</p> <p>小明得到这个“承诺”是因为小明告诉了售票员,他要一张火车票。</p> <h3><strong>创建 Promise 实例</strong></h3> <p>那么,在 JavaScript 里要得到一个 Promise 要怎么做呢?答案就是创建一个 Promise 实例。</p> <p>下面,我们可以来看一下语法了</p> <pre> var promise = new Promise(executor) var promise = new Promise(function(resolve, reject){ ... }) </pre> <p>executor (遗嘱执行者),这是个很形象地参数名。</p> <ol> <li>executor 是一个函数,带有 resolve 、 reject 两个参数</li> <li>executor 在创建实例的时候立即执行</li> <li>executor 在执行的时候会把并把 成功回调函数 和 失败回调函数 作为参数传递进来,赋值给 resolve 和 reject</li> <li>executor 里面调用 resolve 和 reject 会分别触发 promise 的 成功 或 失败</li> </ol> <p>有同学可能会问,创建一个 Promise 实例跟小明买票有什么关系?</p> <p>现在我们用代码来描述一下小明买票的故事。</p> <pre> /* * 比如说写代码的人 我 是 小明 * Promise实例 是 “承诺” * executor 就是 售票员 */ // 我是小明,我要买票,你帮我查查有没有票 var promise = new Promise(function (resolve, reject){ // 先起来去喝个水 drink() // 吃个饭 eat() // 现在搜一下 广州到杭州 的车票 var result = search('广州-杭州') // 如果搜到有车票,就告诉小明有票 if (result !== null) { resolve() } // 如果没有搜到车票,就告诉小明没有票了 else { reject() } }) </pre> <p>小明说要买票,售票员马上就告诉小明“你等等,我查一下!”,给了他这个承诺,这个过程是同步的。而售票员给了小明这个承诺之后,再到告诉小明有票还是没票,这个过程明显是异步的,因为中间售票员还去了喝水吃饭…,查票也需要时间;也可以是同步的,售票员听到之后马上告诉小明,没票了~~</p> <p>executor 做的事情跟售票员很像,就是将 Promise实例 的状态变为 成功 或者 失败 ,在此之前可以执行任何操作(只要不报错~~);就像售票员一样,就是要告诉小明有票还是没票,他中间可以做任何事情。</p> <h2><strong>Promise.prototype.then</strong></h2> <p>看到这里,或许大家都会有个疑问:小明被告知有票或者没票之后可以做什么?</p> <p> </p> <p>来自:http://mertensming.github.io/2016/11/21/promise-practice/</p> <p> </p>
本文由用户 cart 自行上传分享,仅供网友学习交流。所有权归原作者,若您的权利被侵害,请联系管理员。
转载本站原创文章,请注明出处,并保留原始链接、图片水印。
本站是一个以用户分享为主的开源技术平台,欢迎各类分享!