JS每日一題: 如何理解es6中的Promise？

20190123問:

如何理解es6中的Promise？

試題解析：考查對JS中同步異步的理解，及工做中經常使用的使用場景

參考回答

js是單線程的，也就是說一次只能完成一個任務，爲了解決這個問題，js將任務的執行模式分爲兩種， 同步和異步, 在es5中咱們處理異步只能經過的回調的方式進行處理，在多層異步中，回調會一層一層嵌套，也就是所謂的回調地獄，promise就是異步編程的一種解決方案

Promise

特色:

• 對象的狀態不受外界影響, promise對象表明一個異步操做，有三種狀態pendding(進行中), fulfilled(成功), rejected(失敗)
• 一旦狀態改變，就不會再變, 狀態的改變只有兩種可能, pendding => fulfilled及pendding => rejected

基本用法:

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 異步操做成功 */){
    resolve(value); // 將狀態從pendding變成fulfilled
  } else {
    reject(error); // 將狀態從pendding變成rejected
  }
});
複製代碼

promise 生成實例後可使用then方法接收resolved狀態和rejected狀態的回調函數

promise.then( ()=> {
        console.log('resolved')
    }, () => {
        console.log('rejected')
    })
複製代碼

promise原型上具備catch方法， catch方法是rejection的別名， 用於指定發生錯誤時的回調函數

promise.then( ()=> {
        console.log('resolved')
    }, () => {
        console.log('rejected')
    }).catch( (err) => {
        console.log('catch')
    })
複製代碼

promise原型上具備finally方法，用於無論promise對象最後的狀態如何，都會執行的操做

promise.then( ()=> {
        console.log('resolved')
    }, () => {
        console.log('rejected')
    }).finally( (err) => {
        console.log('end')
    })
複製代碼

Promise.all

Promise.all方法用於將多個 Promise 實例，包裝成一個新的 Promise 實例

簡單使用:

const p = Promise.all([p1, p2, p3]);
複製代碼

特色:

• 參數都是promise實例，若是不是會調用promise.resolve方法將其轉爲promise實例
• p的獎態由傳入的promise實例的狀態決定
  • promise實例狀態都變成fulfilled,p狀態爲fulfilled
  • promise實例狀態一個變成rejected,p狀態爲rejected

題後思考

爲什麼實現一個promise

往期

JS每日一題: 前端的緩存有哪些？都適用什麼場景？區別是什麼？
JS每日一題: Call，Apply，Bind的使用與區別，如何實現一個bind？
JS每日一題: 說說你對前端模塊化的理解
JS每日一題: web安全攻擊手段有哪些？以及如何防範

關於JS每日一題

JS每日一題能夠當作是一個語音答題社區
天天利用碎片時間採用60秒內的語音形式來完成當天的考題
羣主在第二天0點推送當天的參考答案

• 注 毫不僅限於完成當天任務，更可能是查漏補缺，學習羣內其它同窗優秀的答題思路

點擊加入答題