Promise的兴起,是因为异步方法调用中,往往会出现回调函数一环扣一环的情况。这种情况导致了回调金字塔的出现。不仅代码写起来费劲不美观,而且问题复杂的时候,阅读代码的人也难以理解。

db.save(data, function(data){
// do something...
db.save(data1, function(data){
// do something...
db.save(data2, function(data){
// do something...
done(data3); // 返回数据
})
});
});

假设有一个数据库保存操作,一次请求需要在三个表中保存三次数据。那么我们的代码就跟上面的代码相似了。这时候假设在第二个db.save出了问题怎么办?基于这个考虑,我们又需要在每一层回调中使用类似try...catch这样的逻辑。这个就是万恶的来源,也是node刚开始广为诟病的一点。

另外一个缺点就是,假设我们的三次保存之间并没有前后依赖关系,我们仍然需要等待前面的函数执行完毕, 才能执行下一步,而无法三个保存并行,之后返回一个三个保存过后需要的结果。(或者说实现起来需要技巧)

其实早在ES6的Promise之前,Qwhen.jsbluebird等等库早就根据Promise标准(参考Promise/A+)造出了自己的promise轮子。
(看过一篇文章,我觉得很有道理。里面说,不要扩展内置的原生对象。这种做法是不能面向未来的。所以这里有一个提示:使用扩展原生Promise的库时,需要谨慎。)

这里仅讨论原生的Promise

ES6 Promise

Promise对象状态

在详解Promise之前,先来点理论:

Promise/A+规范, 规定Promise对象是一个有限状态机。它三个状态:

  • pending(执行中)
  • fulfilled(成功)
  • reject(拒绝)

其中pending为初始状态,fulfilled和rejected为结束状态(结束状态表示promise的生命周期已结束)。

状态转换关系为:

 
 
1
pending->fulfilled,pending->rejected。

随着状态的转换将触发各种事件(如执行成功事件、执行失败事件等)。

Promise形式

Promise的长相就像这样子:

 

JavaScript

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var promise = new Promise(function func(resolve, reject){
    // do somthing, maybe async
    if (success){
      return resolve(data);
    } else {
      return reject(data);
    }
});
 
promise.then(function(data){
    // do something... e.g
    console.log(data);
}, function(err){
    // deal the err.
})

这里的变量promisePromise这个对象的实例。

promise对象在创建的时候会执行func函数中的逻辑。

逻辑处理完毕并且没有错误时,resolve这个回调会将值传递到一个特殊的地方。这个特殊的地方在哪呢?就是下面代码中的then,我们使用then中的回调函数来处理resolve后的结果。比如上面的代码中,我们将值简单的输出到控制台。如果有错误,则rejectthen的第二个回调函数中,对错误进行处理。

配合上面的有限状态机的理论,我们知道在Promise构造函数中执行回调函数代码时,状态为pendingresolve之后状态为fulfilledreject之后状态为reject

Promise数据流动

以上是promise的第一次数据流动情况。

比较funny的是,promise的then方法依然能够返回一个Promise对象,这样我们就又能用下一个then来做一样的处理。

第一个then中的两个回调函数决定第一个then返回的是一个什么样的Promise对象。

  • 假设第一个then的第一个回调没有返回一个Promise对象,那么第二个then的调用者还是原来的Promise对象,只不过其resolve的值变成了第一个then中第一个回调函数的返回值。
  • 假设第一个then的第一个回调函数返回了一个Promise对象,那么第二个then的调用者变成了这个新的Promise对象,第二个then等待这个新的Promise对象resolve或者reject之后执行回调。

话虽然饶了一点,但是我自我感觉说的还是很清楚的呢。哈哈~

如果任意地方遇到了错误,则错误之后交给遇到的第一个带第二个回调函数的then的第二个回调函数来处理。可以理解为错误一直向后reject, 直到被处理为止。

另外,Promise对象还有一个方法catch,这个方法接受一个回调函数来处理错误。即:

 

JavaScript

 
1
2
3
promise.catch(function(err){
    // deal the err.
})

假设对错误的处理是相似的,这个方法可以对错误进行集中统一处理。所以其他的then方法就不需要第二个回调啦~

控制并发的Promise

Promise有一个”静态方法”——Promise.all(注意并非是promise.prototype), 这个方法接受一个元素是Promise对象的数组。

这个方法也返回一个Promise对象,如果数组中所有的Promise对象都resolve了,那么这些resolve的值将作为一个数组作为Promise.all这个方法的返回值的(Promise对象)的resolve值,之后可以被then方法处理。如果数组中任意的Promisereject,那么该reject的值就是Promise.all方法的返回值的reject值.

很op的一点是:
then方法的第一个回调函数接收的resolve值(如上所述,是一个数组)的顺序和Promise.all中参数数组的顺序一致,而不是按时间顺序排序。

还有一个和Promise.all相类似的方法Promise.race,它同样接收一个数组,只不过它只接受第一个被resolve的值。

将其他对象变为Promise对象

Promise.resovle方法,可以将不是Promise对象作为参数,返回一个Promise对象。

有两种情形:

  1. 假设传入的参数没有一个.then方法,那么这个返回的Promise对象变成了resolve状态,其resolve的值就是这个对象本身。
  2. 假设传入的参数带有一个then方法(称为thenable对象), 那么将这个对象的类型变为Promise,其then方法变成Promise.prototype.then方法。

Promise是解决异步的方案吗?

最后说一点很重要的事:Promise的作用是解决回调金字塔的问题,对于控制异步流程实际上没有起到很大的作用。真正使用Promise对异步流程进行控制,我们还要借助ES6 generator函数。(例如Tj大神co库的实现)。

然而ES7将有一个更加牛逼的解决方案:async/await,这个方案类似于co,但是加了原生支持。拭目以待吧。

ES6 Promise(2)的更多相关文章

  1. 通过 ES6 Promise 和 jQuery Deferred 的异同学习 Promise

    Deferred 和 Promise ES6 和 jQuery 都有 Deffered 和 Promise,但是略有不同.不过它们的作用可以简单的用两句话来描述 Deffered 触发 resolve ...

  2. ES6 Promise 接口

    构造函数 new Promise(function(resolve, reject){}); 构造函数接受一个函数(executor)作为参数,该函数在返回 Promise 实例之前被调用.函数的两个 ...

  3. Es6 Promise 用法详解

     Promise是什么??    打印出来看看  console.dir(Promise) 这么一看就明白了,Promise是一个构造函数,自己身上有all.reject.resolve这几个眼熟的方 ...

  4. ES6 Promise 全面总结

    转载:点击查看原文 ES6 Promise对象 ES6中,新增了Promise对象,它主要用于处理异步回调代码,让代码不至于陷入回调嵌套的死路中. @-v-@ 1. Promise本质 Promise ...

  5. ES6 Promise 异步操作

    最近越来越喜欢与大家进行资源分享了,并且及时的同步到自己的园子内,为什么呢? 一.小插曲(气氛搞起) 在上个月末,由于领导的高度重视(haha,这个高度是有多高呢,185就好了),走进了公司骨干员工的 ...

  6. 微信小程序Http高级封装 es6 promise

    公司突然要开放微信小程序,持续蒙蔽的我还不知道小程序是个什么玩意. 于是上网查了一下,就开始着手开发..... 首先开发客户端的东西,都有个共同点,那就是  数据请求! 看了下小程序的请求方式大概和a ...

  7. 解析ES6 Promise

    ES6 Promise 概念之类的,大概读者都应该有所知道,接下来我们直入终点. 先让我们来看看什么是Promise吧,他是一个object,类,arry,function? 首先,学习它的时候应该讲 ...

  8. jquery Promise和ES6 Promise的区别

    1. Deferred对象有resolve和reject方法,可以直接修改状态 jquery用Deferred实现了Promise规范,Deferred与ES6 Promise的最大区别是: Defe ...

  9. ES6 Promise对象then方法链式调用

    then()方法的作用是Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数.then()方法会返回一个新的Promise实例,所以then()方法后面可以继 ...

随机推荐

  1. LINUX C: 获取本地指定网卡的IP地址

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <errno.h> ...

  2. [C#] 序列化实现对象的深拷贝

    //对象深拷贝 public static T Copy<T>(T oldObject) where T : class,new() { T newOrder = new T(); Mem ...

  3. 基于Composer的Laravel扩展包开发工作流

    使用场景 在引用第三方包的时候,对第三方包有改动需求,需要将代码放在自己的仓库:并且自己的其他项目也有需求引用自定义的第三方包:甚至自己会发布修改后的第三方包: 读完本文你讲获得: Git Submo ...

  4. Python中的可迭代对象/迭代器/For循环工作机制/生成器

    本文分成6个部分: 1.iterable iterator区别 2.iterable的工作机制 3.iterator的工作机制 4.for循环的工作机制 5.generator的原理 6.总结 1.i ...

  5. Flask - 特殊装饰器 和 Flask工作结构模式(FBV, CBV)

    目录 Flask - 特殊装饰器 和 Flask工作结构模式 @app.errorhandler() @app.before_request @app.after_request FBV和CBV Fl ...

  6. 编译Openwrt的log

    Openwrt配置: Target System (Ralink RT288x/RT3xxx) ---> Subtarget (MT7688 based boards) ---> Targ ...

  7. python爬虫数据解析的四种不同选择器Xpath,Beautiful Soup,pyquery,re

    这里主要是做一个关于数据爬取以后的数据解析功能的整合,方便查阅,以防混淆 主要讲到的技术有Xpath,BeautifulSoup,PyQuery,re(正则) 首先举出两个作示例的代码,方便后面举例 ...

  8. 【codeforces 509A】Maximum in Table

    [题目链接]:http://codeforces.com/contest/509/problem/A [题意] 给你一个递推式f[i][j] = f[i-1][j]+f[i][j-1]; 让你求f[i ...

  9. [bzoj2989]数列_KD-Tree_旋转坐标系

    数列 bzoj-2989 题目大意:题目链接. 注释:略. 想法:显然,我们用x和a[x]两个值建立笛卡尔坐标系. 两个点之间的距离为曼哈顿距离. 修改操作就是插入... 查询操作就是查询一个点周围的 ...

  10. Java web如何定位工程路径

    一 项目路径的获得 System.getProperty("user.dir"); 可以获得当前用户的工作目录,即在哪个地方启动的java程序,返回就是当前目录 二 web项目根目 ...