Promise概念
- Promise是一个构造函数,可以 new Promise()得到一个promise实例
- 在promise上,有两个函数,分别为:resolve(成功之后的回调函数) reject(失败之后的回调函数)
- 在promise构造函数的prototype属性上,有一个.then()方法。只要是promise构造函数创建的实例,都可以访问到.then()方法。
- promise表示一个异步操作;每当我们new一个promise的实例,这个实例,就表示一个具体的异步操作。
- promise异步操作后只有两种状态:
状态1:异步执行成功了,需要在内部调用成功的回调函数resolve把结果返回给调用者。
状态2:异步执行失败了,需要在内部调用失败的回调函数reject把结果返回给调用者
由于promise是异步操作,所以当内部拿到操作结果是,无法通过return把操作结果返回给调用者,所以要使用回调函数将执行成功或者失败的结果返回给调用者 - 我们可以在new出来的promise实例上,调用.then()方法。【预先】为这个promise异步操作,制定成功(resolve)和失败(reject)回调方法
es6的其中一个特性就是原生支持promise。在这里,我先不说异步编程里的generator和aync/await的属性。它们功能的实现都是基于promise。
Promise的特点在于:
减少回调函数
串并行处理
代码的优雅
这里特别讲一下,ES6在性能优化上可以使用promise或者async/await去压缩请求时间。在过去,很多jquery的页面在调用接口请求都是一个接口等另一个接口,串行执行所有请求,最后在完成最后的回调函数,如此类推。这样的写法会直接导致“回调地狱”。即使你用vue-resource,我也review到非常多的“回调地狱”的情况。为了从根本上解决这个问题并提高开发效率,我建议优先使用promise。(async/await不急着投入使用),考虑到还有很多同事还在高效地开发业务代码。
现在的vue-resource已经支持promise的写法,为了更好地让技术向后发展,我建议将pagekit/vue-resource替换称为mzabriskie/axios和webmodules/jsonp。axios是可以同时满足服务端和浏览器端,同构的写法有助于以后将技术栈往SSR(服务端渲染)发展。jsonp这个库则是为了兼容jsonp的请求需要,需要对它进行了promise的封装。
Promise的使用需要避免以下的写法:
promise.then(function(value) {
// success
}, function(error) {
// failure
});
尽量使用链式写法:
promise.then(function(value) {
// step1
}).then(function(value){
// step2
}).catch(function(value){
// failure
})
并行的操作主要是Promise.all(),它可以将Promise操作的数组并行执行完成然后在进行串行的操作。Promise.race()则是返回并行请求中最先返回的请求的那个结果。它们的使用可以有效地压缩数据获取的时间。