Promise

基本概念：
Promise：是ES6中新增的異步編程解決方案，體現(xiàn)在代碼中它是一個(gè)對(duì)象，可以通過Promise 構(gòu)造函數(shù)來實(shí)例化。

new Promise(cb)
三種狀態(tài)：Pending、 Resolved、Rejected

兩個(gè)原型方法：
Promise.prototype.then()
Promise.prototype.catch()

兩個(gè)常用的靜態(tài)方法：
Promise.all() // 可以將多個(gè)Promise實(shí)例包裝成一個(gè)新的Promise實(shí)例

• 當(dāng)所有Promise實(shí)例的狀態(tài)都變成resolved，Promise.all的狀態(tài)才會(huì)變成resolved，此時(shí)返回值組成一個(gè)數(shù)組，傳遞給then中的resolve函數(shù)。
• 只要期中有一個(gè)被rejected，Promise.all的狀態(tài)就變成rejected，此時(shí)第一個(gè)被rejected的實(shí)例的返回值，會(huì)傳遞給p的回調(diào)函數(shù)。

Promise.resolve()

Pending ====> Resolved(已完成)
Pending ====> Rejected(已失敗)

console.log(1) const p = new Promise(function(resolve, reject){const img = new Image();img.src = '';img.onload = function(){resolve(this);}img.onerror = function(){reject(new Error('圖片加載失敗'));} })p.then(function(img){document.body.appendChild(img); }, function(err){console.log(err) }) //第一個(gè)參數(shù)是執(zhí)行成功的，第二個(gè)函數(shù)是執(zhí)行失敗（一般不推薦第二個(gè)參數(shù)，采用catch） console.log(2) p.catch(function(err){console.log(err) })// 1 2 error（異步，不影響后面加載）var imgs = ['a.jpg', 'b.jpg', 'c.jpg'] function loadImg(url){const p = new Promise(function(resolve, reject){const img = new Image();img.src = '';img.onload = function(){resolve(this);}img.onerror = function(){reject(new Error('圖片加載失敗'));}})return p; }const allDone = Promise.all([loadImg(imgs[0])], [loadImg(imgs[1])], [loadImg(imgs[2])]);allDone.then(function(data){console.log(data) // data 就是一組數(shù)組 }).catch(function(err){console.log(err) // })

Promise.resolve()三種用法
//參數(shù)是Promise實(shí)例，將不做任何修改、原封不動(dòng)的返回這個(gè)實(shí)例

Promise.resolve(loadImg(imgs[0]).then(function(data){console.log(data) // })

//將對(duì)象轉(zhuǎn)為Promise對(duì)象，然后就立即執(zhí)行thenable對(duì)象的then方法

Promise.resolve({then(resolve, reject){const img = new Image();img.src = imgs[0];img.onload = function (){resolve(this)}}}).then(function(data){})

//參數(shù)是一個(gè)基本數(shù)據(jù)類型或者不傳參數(shù) ，那么返回一個(gè)狀態(tài)為resolved的Promise對(duì)象

Promise.resolve('abc').then(function(str){console.log(str); //abc})const p = Promise.resolve();console.log(p) 與50位技術(shù)專家面對(duì)面20年技術(shù)見證，附贈(zèng)技術(shù)全景圖

總結(jié)

以上是生活随笔為你收集整理的ES6 promise的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。