1、promise特点
Promise,简单来说就是一个容器,里面保存着一个异步事件。在es6中被正式加入。
Promise最大的好处就是将异步处理的执行代码和结果处理代码清晰的分离。
Promise有三种状态pending(进行中)、fulfilled(已成功)、rejected(已失败)
2、基本用法
promise本质是一个对象
var promise = new Promise(function (resolve,reject) { //code if(/*异步操作成功*/){ resolve(value); }else{ reject(value) } });
resolve:将Promise对象的状态从pending变为resolve,将异步操作成功的结果作为参数传递出去。
reject:将Promise对象的状态从pending变为rejected,在异步操作失败的时候调用,并将异步操作报出错误,作为参数传递出去。
then方法用来指定resolved和reject状态的回调函数,当Promise的状态改变的时候,就会调用then方法(里面的参数由resolve或者reject传递过来)
3、Promise对ajax请求进行包装
function ajax(url,method) { return new Promise(function (resovle,reject) { var request; if (window.XMLHttpRequest) { request = new XMLHttpRequest(); } else { request = new ActiveXObject('Microsoft.XMLHTTP'); } request.onreadystatechange = function () { if(request.readyState == 4){//请求完成 if(request.status == 200){ resovle(request.responseText); }else{ reject(request.status); } } } request.open(method,url); request.send(); }); } ajax("content.json","GET").then(function (resolve) { console.log(resolve); }).catch(function (reject) { console.log(reject); });
4.all()方法
Promise的all()方法可以同时进行多个请求,并将所有请求的结果放在一个数组中
var p1 = new Promise(function (resolve,reject) { setTimeout(resolve,500,"p1"); }); var p2 = new Promise(function (resolve,reject) { setTimeout(resolve,600,"p2"); }) //all并行执行所有的promise请求,并将请求返回的结果返回一个数组 Promise.all([p1,p2]).then(function (results) { console.log(results); })
5.race()方法
race()方法也是用来执行多个请求,但只返回第一个请求的结果
var p1 = new Promise(function (resolve,reject) { setTimeout(resolve,500,"p1"); }); var p2 = new Promise(function (resolve,reject) { setTimeout(resolve,600,"p2"); })
//race执行所有的promise请求,但只返回最快的,后面的请求也会继续执行,但结果会被丢弃 Promise.race([p1, p2]).then(function (result) { console.log(result); // 'P1' });
6.finally()方法
finally()请求成功或者失败都会调用。