剑客
关注科技互联网

理解 ES6 中的 Promise

理解 ES6 中的 Promise

这篇文章我尝试从感性的角度来理解一下 Promise,举一个栗子。

小明来到火车站,跟售票员说:“我要一张广州到杭州的高铁票”,售票员说:“你等等,我查一下!”

上面这个场景,售票员对小明说的这句话就是一个 “承诺” ,告诉小明,我会替你查一下,看看有没有,如果有余票,就告诉你有,没有就告诉你没有。

那么,小明是怎么得到这个 “承诺” 的呢?

小明得到这个“承诺”是因为小明告诉了售票员,他要一张火车票。

创建 Promise 实例

那么,在 JavaScript 里要得到一个 Promise 要怎么做呢?答案就是创建一个 Promise 实例。

下面,我们可以来看一下语法了

var promise = new Promise(executor)
var promise = new Promise(function(resolve, reject){ ... })

executor (遗嘱执行者),这是个很形象地参数名。

  1. executor 是一个函数,带有 resolvereject 两个参数
  2. executor 在创建实例的时候立即执行
  3. executor 在执行的时候会把并把 成功回调函数失败回调函数 作为参数传递进来,赋值给 resolvereject
  4. executor 里面调用 resolvereject 会分别触发 promise成功失败

有同学可能会问,创建一个 Promise 实例跟小明买票有什么关系?

现在我们用代码来描述一下小明买票的故事。

/*
 * 比如说写代码的人 我 是 小明
 * Promise实例 是 “承诺”
 * executor 就是 售票员
 */

// 我是小明,我要买票,你帮我查查有没有票
var promise = new Promise(function (resolve, reject){
 // 先起来去喝个水
 drink()
 // 吃个饭
 eat()
 // 现在搜一下 广州到杭州 的车票
 var result = search('广州-杭州')
 // 如果搜到有车票,就告诉小明有票
 if (result !== null) {
 resolve()
 }
 // 如果没有搜到车票,就告诉小明没有票了
 else {
 reject()
 }
})

小明说要买票,售票员马上就告诉小明“你等等,我查一下!”,给了他这个承诺,这个过程是同步的。而售票员给了小明这个承诺之后,再到告诉小明有票还是没票,这个过程明显是异步的,因为中间售票员还去了喝水吃饭…,查票也需要时间;也可以是同步的,售票员听到之后马上告诉小明,没票了~~

executor 做的事情跟售票员很像,就是将 Promise实例 的状态变为 成功 或者 失败 ,在此之前可以执行任何操作(只要不报错~~);就像售票员一样,就是要告诉小明有票还是没票,他中间可以做任何事情。

Promise.prototype.then

看到这里,或许大家都会有个疑问:小明被告知有票或者没票之后可以做什么?

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址