Promise

 

Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理强大.

Promise简单说就是一个容器,里面保存着某个未来才会结束的事件(异步操作)的结果.语法上是一个对象,从它可以获取异步操作的消息.

Promise对象有两个特点.

(1)对象的状态不受外界影响。Promise对象代表一个异步操作。有三种状态pending(进行中)、fulfiled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪种状态,其他任何操作都无法改变这个状态。也就是承诺的意思。

(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变只有两种可能:从pending变为fulfilled或者rejected。只要发生变化了,就不会再变,称为resolve(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。

有了Promise对象,就可以将异步操作以同步的流程表达出来,不必层层嵌套写回调。

Promise对象提供统一的接口,让异步操作更加的容易。

Promise构造函数接受一个函数作为参数,该函数有两个参数 分别是resolve和reject。他们是两个函数,由javascript引擎提供,不用自己部署。

Promise实例

const promise = new Promise (function(resolve, reject) {
      if('异步成功') {
        resolve(value)
      } else {
        reject(error);
      }
    })

 

reject函数的作用是:将Promise对象的状态从为完成变为成功(从pending变为resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去。

reject函数的作用时,将Promise对象的状态从未完成变为失败,并将异步操作的错误作为参数传递出去。

实例生成后

    Promise.then(function(value) {
      //sccess
    },function(error) {
      //failure
    })

.then可以接收两个回调函数作为参数。第一个表示状态变为resolved调用,第二个则为rejected调用第二个是可选的。着两个函数都接受Promise对象传出的值作为参数。

Promise新建后就会立即执行

let promise = new Promise(function (resolve, reject) {
      console.log('Promise');
      resolve();
    });
    promise.then(function () {
      console.log('resolved');
    })
    console.log('Hi!')
     // Promise
    // Hi!
    // resolved

Promise 新建后立即执行,所以首先输出的是Promise。然后,then方法指定的回调函数,将在当前脚本所有同步任务执行完才会执行,所以resolved最后输出。

Promise对象实现Ajax操作

const getJSON = function (url) {
      const promise = new Promise(function (resolve, reject) {
        const handel = function () {
          if (this.readyState !== 4) {
            return;
          }
          if (this.status === 200) {
            resolve(this.response)
          } else {
            reject(new Error(this.statusText));
          }
        }
        const client = new XMLHttpRequest();
        client.open('GET', url);
        client.onreadystatechange = handel;
        client.responseType = 'json'
        client.setRequestHeader('Accept', 'application/json')
        client.send();
      });
      return promise

    }
    getJSON('/posts.json').then(function(json) {
      console.log('Contents:' + json);
    }, function(error) {
      console.log('错误',error)
    })
getJSON是对XMLHttpRequest对象的封装,用于发送请求返回Promise对象。其中resolve和reject调用时都带有参数
参数会被传递到then方法的回调函数中。reject返回参数通常是Error对象的实例,就是抛出错误;
resolve除了正常的值以外,还可以是一个Promise对象。
返回Promise例子
const p1 = new Promise(function (resolve, reject) {
      setTimeout(() => reject(new Error('fail')), 3000)
    }) 

    const p2 = new Promise(function (resolve, reject) {
      setTimeout(() => resolve(p1), 1000)
    })

    p2
      .then(result => console.log(result))
      .catch(error => console.log(error))
首先p1的Promise的状态3秒后变为rejected。p2的状态在1秒后变为resolve。
1秒后p2的resolve返回的是p1的Promise,所以导致p2自己的状态失效,由p1决定p2的状态;
2秒后p1的状态变为reject,p1决定p2。所以执行后面的catch方法。

Promise.prototype.then()

then方法是定义在原型对象Promise.prototype上的。对应有连个参数,第一个参数是resolved状态返回的回调函数,第二个可选参数是rejected状态返回的回调函数。

then方法返回的是一个新的Promise实例,所以可以采用链式写法。

 

 原文链接:http://es6.ruanyifeng.com/#docs/promise

posted on 2019-01-25 11:28  不懂那两年  阅读(105)  评论(0编辑  收藏  举报

导航