用Promise封裝異步過程，用async封裝Promise

Promise實例

fetch是個典型的Promise，在當前頁打開chrom控制檯，輸入下面的代碼查看輸出結果

fetch('/').then(res=>res.text()).then(data=>console.log(data.length))
複製代碼

典型的異步操做

setTimeout是典型的異步函數，使用一個回調函數做爲參數 這裏會返回一個正整數，表示定時器的編號

setTimeout(
   function () {
       console.log('123')
   },
   1000   
)
複製代碼

封裝成Promise

用Math.random生成rnd 若是rnd大於0.5則resolve(rnd)，不然reject(rnd) 一個new Promise是一個立執行的函數，要有then和catch

new Promise((resolve,reject)=>{
    setTimeout(()=>{
        let rnd = Math.random()
        if(rnd > 0.5)
            resolve(rnd)
        else
            reject(rnd)
    }, 1000)
})
.then(res=>console.log('resolve=', res))
.catch(err=>console.log('reject=', err))
複製代碼

把Promise封裝成一個函數的返回值

只須要用普通函數封裝new Promise 不馬上執行的promise，不須要then和catch，在調用的時候補充便可

let p1 = ()=> new Promise((res,rej)=>    
        setTimeout(()=>{
            let rnd = Math.random()
            if(rnd > 0.5)
                res(rnd)
            else
                rej(rnd)
        }, 1000)
    )
複製代碼

用async/await封裝Promsie，用同步的方式寫異步

async/await 是Promise的語法糖， await 後面接的是Promise的調用， await 拿到的是resolve的數據，也就是傳給then的數據， reject的數據須要try...catc， catch的err是try中全部的await的錯誤

let q1 = async ()=>{
    try {
        let res = await p1()
        console.log('await res=', res)
    }
    catch(err) {
        console.warn('awati rej=', err)
    }
}
複製代碼

測試

async函數不帶await執行，至關於同步函數

for(let i = 0; i<10; i++) {
   q1()
}
複製代碼

async函數帶await執行，纔是同步方式寫異步

for(let i = 0; i<10; i++) {
   await q1()
}
複製代碼

後記： 其實，new Promise裏放同步函數異步函數均可以，不過同步就不必用Promise。 Node8 就提供了 util.promisify() 這個方法，方便咱們快捷的把原來的異步回調方法改爲返回 Promise 實例的方法，接下來，想繼續用隊列，仍是 await 就看須要了。 只要符合 Node.js 的回調風格，全部函數均可以這樣轉換。 知足下面兩個條件便可。

1. 最後一個參數是函數
2. 回調函數的參數爲 (err, result)，前面是可能的錯誤，後面是正常的結果。

參考

www.bilibili.com/video/BV12E…