码迷,mamicode.com
首页 > 其他好文 > 详细

Promise对象

时间:2015-03-08 16:56:22      阅读:154      评论:0      收藏:0      [点我收藏+]

标签:

异步模式编程的4种方法

  • 回调函数
function f1(callback){
   setTimeout(function () {
     // f1的任务代码
     callback();
   }, 1000);
 }

f1(f2); //f1不会堵塞程序运行,相当于先执行程序的主要逻辑,将耗时的操作推迟执行。

回调函数的优点是简单、容易理解和部署,缺点是不利于代码的阅读和维护,各个部分之间高度耦合(Coupling),使得程序结构混乱、流程难以追踪(尤其是回调函数嵌套的情况),而且每个任务只能指定一个回调函数。

 

  • 事件监听:采用事件驱动模式
f1.on(‘done‘, f2);
function f1(){
  setTimeout(function () {
    // f1的任务代码
    f1.trigger(‘done‘);
  }, 1000);
}

  优点是比较容易理解,可以绑定多个事件,每个事件可以指定多个回调函数,而且可以"去耦合"(Decoupling),有利于实现模块化。缺点是整个程序都要变成事件驱动型,运行流程会变得很不清晰。

  • 发布/订阅

"事件"完全可以理解成"信号",如果存在一个"信号中心",某个任务执行完成,就向信号中心"发布"(publish)一个信号,其他任务可以向信号中心"订阅"(subscribe)这个信号,从而知道什么时候自己可以开始执行。这就叫做"发布/订阅模式"(publish-subscribe pattern),又称"观察者模式"(observer pattern)。

1 jQuery.subscribe("done", f2);
2 
3 function f1(){
4   setTimeout(function () {
5     // f1的任务代码
6     jQuery.publish("done");
7  }, 1000);
8 }

这种方法的性质与"事件监听"类似,但是明显优于后者。因为我们可以通过查看"消息中心",了解存在多少信号、每个信号有多少订阅者,从而监控程序的运行。 

  • promise对象

Promises?首先,它是一个对象,也就是说与其他JavaScript对象的用法,没有什么两样;其次,它起到代理作用(proxy),使得异步操作具备同步操作(synchronous code)的接口,即充当异步操作与回调函数之间的中介,使得程序具备正常的同步运行的流程,回调函数不必再一层层包裹起来。

  思想是每一个异步任务立刻返回一个Promise对象,由于是立刻返回,所以可以采用同步操作的流程

三种状态:

  未完成(pending)、已完成(fulfilled)、失败(rejected)
  这三种的状态的变化途径只有两个,且只能发生一次:从“未完成”到“已完成”,或者从“未完成”到“失败”。一旦当前状态变为“已完成”或“失败”,就意味着不会再发生状态变了

  Promise对象的运行结果,最终只有两种

      得到一个值,状态变为fulfilled
      抛出一个错误,状态变为rejected

  promise对象的then方法用来添加回调函数 

  • Promise实现

  定义构造函数  

var Promise = function() {
  this.state = ‘pending‘; //Promise状态,默认为pending
  this.thenables = []; //存放then方法生成的内部对象
};

  resolve()  //将对象的状态从‘pending‘变成‘fulfilled‘

Promise.prototype.resolve = function(value) {
  if (this.state != ‘pending‘) return;

  this.state = ‘fulfilled‘; //更新状态
  this.value = value; //存放异步返回的value
  this._handleThen();
  return this;
}

  reject() // 将对象状态从‘pending‘变成‘rejected‘

Promise.prototype.reject = function(reason) {
  if (this.state != ‘pending‘) return;

  this.state = ‘rejected‘; //更新状态
  this.reason = reason; //存放异步返回的reason
  this._handleThen();
  return this;
};

  then()

/**then 方法
* onFulfilled: 异步操作成功后callback
* onRejected:异步操作失败后callback
*/
Promise.prototype.then = function(onFulfilled, onRejected) {
  var thenable = {}; //定义thenabale对象

  if (typeof onFulfilled == ‘function‘) {
    thenable.fulfill = onFulfilled; //添加onFulfilled
  };

  if (typeof onRejected == ‘function‘) {
    thenable.reject = onRejected; //添加onRejected
  };

  if (this.state != ‘pending‘) {
    setImmediate(function() {
      this._handleThen();
    }.bind(this));
  }

  thenable.promise = new Promise(); //生成Promise对象
  this.thenables.push(thenable); //thenable对象添加到thenables数组里

  return thenable.promise; //返回Promise对象
}

  _handleThen()  

Promise.prototype._handleThen = function() {
  if (this.state === ‘pending‘) return;

  f (this.thenables.length) { //检查thenables属性是否有值
    for (var i = 0; i < this.thenables.length; i++) {
      var thenPromise = this.thenables[i].promise; //Promise对象
      var returnedVal; //需要return value
      try {
        switch (this.state) {
          case ‘fulfilled‘: //success
            if (this.thenables[i].fulfill) {
              //成功的callback
              returnedVal = this.thenables[i].fulfill(this.value);
            } else {
              //手动触发 resolve
              thenPromise.resolve(this.value);
            }
          break;
          case ‘rejected‘: //fail
            if (this.thenables[i].reject) {
              // 失败的callback
              returnedVal = this.thenables[i].reject(this.reason);
            } else {
              //手动触发 reject
              thenPromise.reject(this.reason);
            }
          break;
        }

        // 返回值
        if (returnedVal === null) {
          this.thenables[i].promise.resolve(returnedVal);
        } else if (returnedVal instanceof Promise || typeof returnedVal.then === ‘function‘) {
          returnedVal.then(thenPromise.resolve.bind(thenPromise), thenPromise.reject.bind(thenPromise));
        } else {
          this.thenables[i].promise.resolve(returnedVal);
        }
      } catch (e) {
        thenPromise.reject(e);
      }
    }
    this.thenables = [];
  }
}

Promises的优点在于,让回调函数变成了规范的链式写法,程序流程可以看得很清楚。它的一整套接口,可以实现许多强大的功能,比如为多个异步操作部署一个回调函数、为多个回调函数中抛出的错误统一指定处理方法等等。

 

 

Promise对象

标签:

原文地址:http://www.cnblogs.com/slogeor/p/4321881.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!