# promise、promise all?到底要承諾甚麼? 在使用Ajax來抓取遠端資料時,因為非同步的關係, 會等到所有的code都跑完之後,再跑回來讀取抓資料的code。 所以如果遇到需要抓完資料後, 才能執行的功能上,就會出現讓人崩潰的狀況 ![](https://i.imgur.com/qip5eJk.jpg) 資.料.跑.不.出.來!!! 所以Promise就很重要了,他會承諾你在全部的code執行完後,才會有所行動。 以下是promise的寫法: ``` let word = new Promise(function(resolve, reject) { resolve(); // 抓取成功 reject(); // 抓取失敗 }) // new Promise(function(resolve, reject)括號裡的 resolve 跟 reject 可以隨意命名 (你要叫abc, handsome...都可以,只是用預設的比較不會搞混) ``` 那我要怎麼判斷現在是成功還是失敗?擺爛? ![](https://i.imgur.com/GqGkTVH.jpg) 其實promise可以用兩個方法來幫你:`.then`和`.catch`,這兩個方法差別在於, `.then`在執行失敗之後還是會繼續執行下去,但是`.catch`不會, 所以說我們大多會用`.then`去接收成功的訊號,`.catch`則是用來接收失敗的訊號 ``` function ISitGood(num) { return new Promise((resolve, reject) => { num ? resolve(`${num}, 成功`) : reject('失敗'); }); } //////////////////////////////////////////////////////////////////////// 貼心小註解: ISitGood(num)裡面的"?" 還有 ":" 是三元運算子的寫法, 意思大概是"num是不是成立,如果是就等於resolve,不然就是reject" /////////////////////////////////////////////////////////////////////// ISitGood(1).then(success => { console.log(success); return ISitGood(2); }).then(success => { console.log(success); return ISitGood(0); // num=0即失敗,promise的結果為reject,這個階段會進入 catch }).then(success => { // 由於上一個階段結果是 reject,catch收到失敗的訊號 console.log(success); return ISitGood(3); }) .catch(fail => { console.log(fail); }) ``` 怎樣?很簡單吧?(其實複雜到哭RRRRR) ![](https://i.imgur.com/fVUsDDn.jpg) 然後如果今天要抓的資料太多,我們會使用promise的一個`.all`功能。 把所有的promise都執行完後,回傳一包陣列結果到系統上。 ``` function ISitGood(num) { return new Promise((resolve, reject) => { num ? resolve(`${num}, 成功`) : reject('失敗'); }); } let datas = [ISitGood(1), ISitGood(2), ISitGood(3), ISitGood(35), ISitGood(135)]; Promise.all(datas) .then(res => { console.log(res); }); ``` 這個方法能夠確保全部的東西都讀完之後,才會繼續進行其他工作。