ES6 promise

jerry 發(fā)布于2019-08-22 16:18 / 2031人閱讀

摘要：基本概念是中新增的異步編程解決方案，體現(xiàn)在代碼中它是一個對象，可以通過構造函數(shù)來實例化。只要期中有一個被，的狀態(tài)就變成，此時第一個被的實例的返回值，會傳遞給的回調函數(shù)。

Promise

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

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

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

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

當所有Promise實例的狀態(tài)都變成resolved，Promise.all的狀態(tài)才會變成resolved，此時返回值組成一個數(shù)組，傳遞給then中的resolve函數(shù)。

只要期中有一個被rejected，Promise.all的狀態(tài)就變成rejected，此時第一個被rejected的實例的返回值，會傳遞給p的回調函數(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)
}) //第一個參數(shù)是執(zhí)行成功的，第二個函數(shù)是執(zhí)行失敗（一般不推薦第二個參數(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實例，將不做任何修改、原封不動的返回這個實例

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

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

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

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

  Promise.resolve("abc").then(function(str){
   console.log(str); //abc
  })
  
  const p = Promise.resolve();
  console.log(p)

云服務器 GPU云服務器 es6中的promise Promises promise promises異步

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/94224.html

ES6-7

摘要：的翻譯文檔由的維護很多人說，阮老師已經(jīng)有一本關于的書了入門，覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中，顯得越來越重要。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。 JavaScript Promise 迷你書（中文版）超詳細介紹promise的gitbook，看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...

mudiyouyou 2019-08-21 18:40 評論0 收藏0
通過 ES6 Promise 和 jQuery Deferred 的異同學習 Promise

摘要：和和都有和，但是略有不同。實際上返回的是一個對象。和添加的回調，添加的回調。所以在調用成功的情況下執(zhí)行添加的回調，調用失敗時執(zhí)行添加的回調。，產(chǎn)生對象并，產(chǎn)生對象并，然后繼續(xù)處理，的語法糖，和的差不多但不同。 Deferred 和 Promise ES6 和 jQuery 都有 Deffered 和 Promise，但是略有不同。不過它們的作用可以簡單的用兩句話來描述 Deffere...

Yujiaao 2019-08-21 10:39 評論0 收藏0
es6 - Promise

摘要：所謂異步編程中的異步是相對于同步的概念的。是一系列異步編程規(guī)范的統(tǒng)稱。如果中的回調函數(shù)返回一個值，那么返回的將會成為接受狀態(tài)，并且將返回的值作為接受狀態(tài)的回調函數(shù)的參數(shù)值。參考介紹基礎篇深入理解與異步編程。 es6 promise與異步編程對于一些還不具備大量編程經(jīng)驗的朋友來說，promise可能是es6比較難以掌握的點。首先是很多名詞，比如Promises，es6 Promise,...

wemallshop 2019-08-22 15:11 評論0 收藏0
JavaScript 異步

摘要：從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。寫一個符合規(guī)范并可配合使用的寫一個符合規(guī)范并可配合使用的理解的工作原理采用回調函數(shù)來處理異步編程。 JavaScript怎么使用循環(huán)代替(異步)遞歸問題描述在開發(fā)過程中，遇到一個需求：在系統(tǒng)初始化時通過http獲取一個第三方服務器端的列表，第三方服務器提供了一個接口，可通過...

tuniutech 2019-08-21 18:34 評論0 收藏0
淺談ES6原生Promise

摘要：如果有錯誤，則到的第二個回調函數(shù)中，對錯誤進行處理。假設第一個的第一個回調沒有返回一個對象，那么第二個的調用者還是原來的對象，只不過其的值變成了第一個中第一個回調函數(shù)的返回值。 ES6標準出爐之前，一個幽靈，回調的幽靈，游蕩在JavaScript世界。正所謂：世界本沒有回調，寫的人多了，也就有了})})})})})。 Promise的興起，是因為異步方法調用中，往往會出現(xiàn)回調函數(shù)一...

yedf 2019-08-20 10:30 評論0 收藏0
ES6的Promise：要優(yōu)雅，也要浪漫

摘要：就算改變已經(jīng)發(fā)生了，即使再對對象添加回調函數(shù)，也會立即得到這個結果。方法接收個參數(shù)，第一個參數(shù)是狀態(tài)的回調函數(shù)，第二個參數(shù)可選是狀態(tài)的回調函數(shù)。簡單來講，就是能把原來的回調寫法分離出來，在異步操作執(zhí)行完后，用鏈式調用的方式執(zhí)行回調函數(shù)。在ECMAScript 6標準中，Promise被正式列為規(guī)范，Promise，字面意思就是許諾，承諾，嘿，聽著是不是很浪漫的說？我們來探究一下這個浪...

weizx 2019-08-20 12:04 評論0 收藏0