JavaScript中Promise的使用详解
Promise是ES6中的函数，规范了如何处理异步任务的回调函数，功能类似于jQuery的defferred。简单说就是通过promise对象的不同状态调用不同的回调函数。目前IE8及以下不支持，其他浏览器都支持。
promise对象的状态，从Pending转换为Resolved或Rejected之后，这个promise对象的状态就不会再发生任何变化。
使用步骤：
varpromise=newPromise(function(resolve,reject){
//异步任务，通过调用resolve(value)或reject(error)，以改变promise对象的状态；改变状态的方法只能在此调用。
//promise状态改变后，会调用对应的回调方法
});
promise.then(function(value){//resolve时的回调函数，参数由异步的函数传进来})
.catch(function(error){//发生异常时或明确reject()时的回调函数})
具体使用：
functiongetURL(URL){//因为promise创建时即执行，所以用工厂函数封装promise对象
returnnewPromise(function(resolve,reject){
varreq=newXMLHttpRequest();
req.open('GET',URL,true);
req.onload=function(){
if(req.status===200){
resolve(req.responseText);
}else{
reject(newError(req.statusText));
}
};
req.onerror=function(){
reject(newError(req.statusText));
};
req.send();
});
}
//运行示例
varURL="http://httpbin.org/get";
getURL(URL).then(functiononFulfilled(value){
console.log(value);
}).catch(functiononRejected(error){
console.error(error);
});
Promise的回调只有异步方式，即使是同步任务的回调也是异步执行。
varpromise=newPromise(function(resolve){
console.log("innerpromise");//执行1：同步任务先执行
resolve(‘callBack');
});
promise.then(function(value){
console.log(value);//执行3:虽然注册时状态为resolved，但回调仍是异步的；
});
console.log("outerpromise");//执行2：同步代码先执行
promise的方法链
then方法注册的回调会依次被调用，每个then方法之间通过return返回值传递参数。但是回调中的异常会导致跳过之间then的回调，直接调用catch的回调，之后再继续调用剩下的then的回调。在then(onFulfilled,onRejected)中，onFulfilled的异常不会被自己的onRejected捕获，所以优先使用catch。
promise.then(taskA).then(taskB).catch(onRejected).then(finalTask);
taskA抛异常，taskB被跳过，finalTask仍会被调用，因为catch返回的promise对象的状态为resolved。
then方法内可以返回3种值
1.返回另一个promise对象，下一个then方法根据其状态选择onFullfilled/onRejected回调函数执行，参数仍由新promise的resolv/reject方法传递；
2.返回一个同步值，下一个then方法沿用当前promise对象的状态，无需等异步任务结束会立即执行；实参为上一then的返回值；如果没有return，则默认返回undefined；
3.抛出异常（同步/异步）：thrownewError(‘xxx');
then不仅是注册一个回调函数，还会将回调函数的返回值进行变换，创建并返回一个新promise对象。实际上Promise在方法链中的操作的都不是同一个promise对象。
varaPromise=newPromise(function(resolve){
resolve(100);
});
varthenPromise=aPromise.then(function(value){
console.log(value);
});
varcatchPromise=thenPromise.catch(function(error){
console.error(error);
});
console.log(aPromise!==thenPromise);//=>true
console.log(thenPromise!==catchPromise);//=>true
Promise.all()静态方法，同时进行多个异步任务。在接收到的所有promise对象都变为FulFilled或者Rejected状态之后才会继续进行后面的处理。
Promise.all([promiseA,promiseB]).then(function(results){//results是个数组，元素值和前面promises对象对应});
//由promise对象组成的数组会同时执行，而不是一个一个顺序执行，开始时间基本相同。
functiontimerPromisefy(delay){
console.log('开始时间：”'+Date.now())
returnnewPromise(function(resolve){
setTimeout(function(){
resolve(delay);
},delay);
});
}
varstartDate=Date.now();
Promise.all([
timerPromisefy(100),//promise用工厂形式包装一下
timerPromisefy(200),
timerPromisefy(300),
timerPromisefy(400)
]).then(function(values){
console.log(values);//[100，200，300，400]
});
不同时执行，而是一个接着一个执行promise
//promisefactories返回promise对象,只有当前异步任务结束时才执行下一个then
functionsequentialize(promiseFactories){
varchain=Promise.resolve();
promiseFactories.forEach(function(promiseFactory){
chain=chain.then(promiseFactory);
});
returnchain;
}
Promise.race()同all()类似，但是race()只要有一个promise对象进入FulFilled或者Rejected状态的话，就会执行对应的回调函数。不过在第一个promise对象变为Fulfilled之后，并不影响其他promise对象的继续执行。
//沿用Promise.all()的例子
Promise.race([
timerPromisefy(1),
timerPromisefy(32),
timerPromisefy(64),
timerPromisefy(128)
]).then(function(value){
console.log(values);//[1]
});
Promise.race()作为定时器的妙用
Promise.race([
newPromise(function(resolve,reject){
setTimeout(reject,5000);//timeoutafter5secs
}),
doSomethingThatMayTakeAwhile()
]);
在then中改变promise状态
因为then的回调中只有value参数，没有改变状态的方法（只能在构造方法的异步任务中使用），要想改变传给下一个then的promise对象的状态，只能重新new一个新的Promise对象，在异步任务中判断是否改变状态，最后return出去传给下一个then/catch。
varpromise=Promise.resolve(‘xxx');//创建promise对象的简介方法
promise.then(function(value){
varpms=newPromise(function(resolve,reject){
setTimeout(function(){
//在此可以判断是否改变状态reject/resolve
Reject(‘args')；
},1000);
})
returnpms;//该promise对象可以具有新状态，下一个then/catch需要等异步结束才会执行回调；如果返回普通值/undefined，之后的then/catch会立即执行
}).catch(function(error){
//被reject时调用
console.log(error)
});
获取两个promises的结果
//方法1：通过在外层的变量传递
varuser;
getUserByName('nolan').then(function(result){
user=result;
returngetUserAccountById(user.id);
}).then(function(userAccount){
//可以访问user和userAccount
});
//方法2：后一个then方法提到前一个回调中
getUserByName('nolan').then(function(user){
returngetUserAccountById(user.id).then(function(userAccount){
//可以访问user和userAccount
});
});
注意使用promise时的整体结构
假定doSomething()和doSomethingElse()都返回了promise对象
常用方式：
doSomething().then(doSomethingElse).then(finalHandler); doSomething |-----------------| doSomethingElse(resultOfDoSomething)//返回新promise，下一个then要收到新状态才执行 |------------------| finalHandler(resultOfDoSomethingElse) |---------------------|
常用变通方式：
doSomething().then(function(){returndoSomethingElse();}).then(finalHandler);
doSomething
|-----------------|
doSomethingElse(undefined)//then外层函数的arguments[0]==resultOfDoSomething
|------------------|
finalHandler(resultOfDoSomethingElse)
|------------------|
错误方式1：
doSomething().then(function(){doSomethingElse();}).then(finalHandler);
doSomething
|-----------------|
doSomethingElse(undefined)//虽然doSomethingElse会返回promise对象，但最外层的回调函数是returnundefined，所以下一个then方法无需等待新promise的状态，会马上执行回调。
|------------------|
finalHandler(undefined)
|------------------|
错误方式2：
doSomething().then(doSomethingElse()).then(finalHandler); doSomething |-----------------| doSomethingElse(undefined)//回调函数在注册时就直接被调用 |----------| finalHandler(resultOfDoSomething) |------------------|