Promise 對(duì)象
1.Promise對(duì)象是ES6對(duì)異步編程的一種解決方案蜡饵，它有以下兩個(gè)特點(diǎn)：
- Promise對(duì)象代表一個(gè)異步操作萧锉，它只有三種狀態(tài)：Pending（進(jìn)行中）细疚、Resolved（已完成，又稱 Fulfilled）和Rejected（已失敗）息裸，并且該狀態(tài)不會(huì)受外界的影響
- Promise對(duì)象的狀態(tài)改變，只有兩種可能：從 Pending 變?yōu)?Resolved 或者從 Pending 變?yōu)?Rejected沪编，并且一旦狀態(tài)改變呼盆，就不會(huì)再變，任何時(shí)候都可以得到這個(gè)結(jié)果
2.Promise對(duì)象的一些缺點(diǎn)：
- 一旦新建了一個(gè)Promise對(duì)象蚁廓，就會(huì)立即執(zhí)行访圃，并且無法中途取消
<pre>
let promise = new Promise(function(resolve, reject) {
console.log('Promise');
resolve();
});
// Promise
</pre> - 如果不設(shè)置Promise對(duì)象的回調(diào)函數(shù)，Promise會(huì)在內(nèi)部拋出錯(cuò)誤相嵌，不會(huì)反應(yīng)到外部腿时，也就是在外部拿不到錯(cuò)誤提示
- 如果Promise對(duì)象處于Pending狀態(tài)時(shí)况脆，是無法得知捕獲進(jìn)展到哪一個(gè)階段的（剛剛開始還是即將完成）
3.Promise對(duì)象是一個(gè)構(gòu)造函數(shù)，用來生成Promise實(shí)例批糟，下面是創(chuàng)造了一個(gè)Promise實(shí)例的示例
let promise = new Promise(function(resolve, reject) {
// ... to do
if ( success ){
resolve(value); //成功操作
} else {
reject(error); //失敗操作
}
});
ps：Promise 構(gòu)造函數(shù)接受一個(gè)函數(shù)作為參數(shù)格了，該函數(shù)的兩個(gè)參數(shù)分別是 resolve 和 reject ，分別用來處理成功和失敗的回調(diào)跃赚；
4.Promise實(shí)例生成以后笆搓，可以用 then 方法分別指定 Resolved 狀態(tài)和 Reject 狀態(tài)的回調(diào)函數(shù)；
promise.then(function(value) {
// success
}, function(error) {
// failure
});
ps：then方法可以接受兩個(gè)回調(diào)函數(shù)作為參數(shù)纬傲。第一個(gè)回調(diào)函數(shù)是Promise對(duì)象的狀態(tài)變?yōu)镽esolved時(shí)調(diào)用满败，第二個(gè)回調(diào)函數(shù)是Promise對(duì)象的狀態(tài)變?yōu)镽ejected時(shí)調(diào)用，其中叹括，第二個(gè)函數(shù)是可選的算墨；
5.resolve函數(shù)的參數(shù)除了正常的值以外，還可能是另一個(gè) Promise 實(shí)例汁雷，表示異步操作的結(jié)果有可能是一個(gè)值净嘀，也有可能是另一個(gè)異步操作；
let promise1 = new Promise(function (resolve, reject) {
// ...
});
let promise2 = new Promise(function (resolve, reject) {
// ...
resolve(p1);
})
上面代碼表示一個(gè)異步操作的結(jié)果是返回另一個(gè)異步操作侠讯，promise1 的狀態(tài)就會(huì)傳遞給 promise2 , 如果 promise1 的狀態(tài)是Pending挖藏，那么 promise2 的回調(diào)函數(shù)就會(huì)等待promise1的狀態(tài)改變；如果promise1的狀態(tài)已經(jīng)是Resolved或者Rejected厢漩，那么promise2的回調(diào)函數(shù)將會(huì)立刻執(zhí)行;
6.Promise實(shí)例方法then返回的是一個(gè)新的Promise實(shí)例,因此可以采用鏈?zhǔn)綄懛っ撸磘hen方法后面再調(diào)用另一個(gè)then方法
let promise = new Promise(function (resolve, reject) {
// ...
})
promise.then(function(res) {
return res.post;
}).then(function(post) {
// ...
});
ps：上例中依次指定了兩個(gè)回調(diào)函數(shù)，第一個(gè)回調(diào)函數(shù)完成以后溜嗜，會(huì)將返回結(jié)果作為參數(shù)宵膨，傳入第二個(gè)回調(diào)函數(shù)，如果返回的是 Promise 對(duì)象（即有異步操作）炸宵，這時(shí)后一個(gè)回調(diào)函數(shù)辟躏，就會(huì)等待該P(yáng)romise對(duì)象的狀態(tài)發(fā)生變化，才會(huì)被調(diào)用
let promise = new Promise(function (resolve, reject) {
// ...
})
promise.then(function(res) {
return new Promise(/.../);
}).then(function(res) {
// Resolved
},function(error){
// Rejected
});
7.Promise.prototype.catch 方法用于指定發(fā)生錯(cuò)誤時(shí)的回調(diào)函數(shù)土全，不僅異步操作拋出錯(cuò)誤（即狀態(tài)就會(huì)變?yōu)镽ejected）捎琐，而且 then 方法指定的回調(diào)函數(shù)，如果運(yùn)行中拋出錯(cuò)誤裹匙，也會(huì)被catch方法捕獲
let promise = new Promise(function(resolve, reject) {
throw new Error('test');
}).catch(function(error) {
console.log(error);
});
// Error: test
8.如果Promise狀態(tài)已經(jīng)變成Resolved瑞凑，再拋出錯(cuò)誤是無效的
let promise = new Promise(function(resolve, reject) {
resolve('ok');
throw new Error('test');
});
promise
.then(function(value) { console.log(value) })
.catch(function(error) { console.log(error) });
//ok
ps： 出現(xiàn)上述結(jié)果是由于 之前提到的 Promise 的狀態(tài)一旦改變，就永久保持該狀態(tài)幻件，不會(huì)再變了拨黔，因此在 resolve 語句后面，再拋出錯(cuò)誤，是不會(huì)被捕獲的
9.Promise 對(duì)象的錯(cuò)誤具有“冒泡”性質(zhì)篱蝇，會(huì)一直向后傳遞贺待，直到被捕獲為止，因此建議總是使用catch方法零截，而不使用then方法的第二個(gè)參數(shù)麸塞，因?yàn)槭褂胏atch方法可以捕獲前面then方法執(zhí)行中的錯(cuò)誤
// bad
promise
.then(function(data) {
// success
}, function(err) {
// error
});
// good
promise
.then(function(data) { //cb
// success
})
.catch(function(err) {
// error
});
10.Promise.all方法用于將多個(gè) Promise 實(shí)例，包裝成一個(gè)新的 Promise 實(shí)例涧衙，該方法接收一個(gè) promise對(duì)象的數(shù)組作為參數(shù)哪工，當(dāng)這個(gè)數(shù)組里的所有promise對(duì)象全部變?yōu)閞esolve或reject狀態(tài)的時(shí)候，它才會(huì)去調(diào)用 .then 方法弧哎。
var p1 = new Promise(function (resolve) {
setTimeout(function () {
resolve("Hello");
}, 3000);
});
var p2 = new Promise(function (resolve) {
setTimeout(function () {
resolve("World");
}, 1000);
});
Promise.all([p1, p2]).then(function (result) {
console.log(result); // ["Hello", "World"]
});
上面的例子模擬了傳輸兩個(gè)數(shù)據(jù)需要不同的時(shí)長雁比，雖然 p2 的速度比 p1 要快，但是 Promise.all 方法會(huì)按照數(shù)組里面的順序?qū)?strong>結(jié)果返回撤嫩，但 promise 本身并不是一個(gè)個(gè)的順序執(zhí)行的偎捎，而是同時(shí)開始、并行執(zhí)行的序攘，可以利用這個(gè)特點(diǎn)處理需要多個(gè)回調(diào)返回后才能進(jìn)行的操作
11.Promise.race方法和Promise.all方法類似茴她，也接收一個(gè)promise對(duì)象數(shù)組為參數(shù)，不同的是只要該數(shù)組中的 Promise 對(duì)象的狀態(tài)發(fā)生變化（無論是 resolve 還是 reject）該方法都會(huì)返回程奠。
<pre>
var p1 = new Promise(function (resolve) {
setTimeout(function () {
resolve("Hello");
}, 3000);
});
var p2 = new Promise(function (resolve) {
setTimeout(function () {
resolve("World");
}, 1000);
});
Promise.race([p1, p2]).then(function (result) {
console.log(result); // Wrold
});
</pre>
12.一般情況下我們都會(huì)使用 new Promise() 來創(chuàng)建promise對(duì)象丈牢，除此之外，可以使用 Promise.resolve 和 Promise.reject這兩個(gè)方法瞄沙；
- 靜態(tài)方法Promise.resolve(value) 可以認(rèn)為是 new Promise() 方法的快捷方式
<pre>
let promise = Promise.resolve('resolved');
//等價(jià)于
let promise = new Promise(function(resolve){
resolve('resolved');
});
</pre>
上述的promise對(duì)象立即進(jìn)入確定（即resolved）狀態(tài)己沛，并將 'resolved' 傳遞給后面then里所指定的 onFulfilled 函數(shù)。
<pre>
Promise.resolve('resolved').then(function(value){
console.log(value);
});
// resolved
</pre> - Promise.reject(error)是和 Promise.resolve(value) 類似的靜態(tài)方法帕识，是 new Promise() 方法的快捷方式泛粹。
<pre>
let promise = Promise.reject(new Error("出錯(cuò)了"));
//等價(jià)于
let promise = new Promise(function(resolve,reject){
reject(new Error("出錯(cuò)了"));
});
</pre>
上述 promise 對(duì)象通過then指定的 onRejected 函數(shù)遂铡，并將錯(cuò)誤（Error）對(duì)象傳遞給這個(gè) onRejected 函數(shù)
<pre>
Promise.reject(new Error("fail!")).catch(function(error){
console.error(error);
});
// Error : fail!
</pre>
13.我們可以利用 Promise 應(yīng)用到我們實(shí)際開發(fā)中肮疗，下面舉幾個(gè)栗子
//圖片加載
const preloadImage = function (path) {
return new Promise(function (resolve, reject) {
var image = new Image();
image.onload = resolve(image);
image.onerror = function() {
reject(new Error('Could not load image at ' + path));
};
image.src = path;
});
}
//文件讀取
function reader (file) {
return new Promise(function (resolve, reject) {
let reader = new FileReader();
reader.onload = function () {
resolve(reader);
};
reader.onerror = function() {
reject(new Error('Could not open the file ' + file));
};
if (!file.type || /^text\//i.test(file.type)) {
reader.readAsText(file);
} else {
reader.readAsDataURL(file);
}
})
}