成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ES6系列文章 Promise

thekingisalwaysluc / 1163人閱讀

摘要：已成功，內(nèi)部執(zhí)行了方法，實例處于狀態(tài)，狀態(tài)不可改變了。實際上是函數(shù)的一種簡寫形式，當執(zhí)行后，可以被的回調(diào)函數(shù)接收處理。該語句并未執(zhí)行若內(nèi)部發(fā)生錯誤，會被自動的執(zhí)行。靜態(tài)函數(shù)返回一個成功的對象，靜態(tài)函數(shù)返回一個拒絕狀態(tài)的對象。

視頻講解

ES6的 Promise 是個啥哩？，是個承諾。為了解決 js 回調(diào)地獄。Promise 給我的體會是: 開始云里霧里，然后越用越好用。今天才明白承諾是什么意思？比如我自己的承諾，如果減肥成功就買個iphone,如果減肥失敗就去死~,哈哈然而我并不會。

基本語法 
new Promise((resolve, reject) => {
    // ...
});

resolve, reject 方法由 js 引擎提供，不需要個人編寫。

Promise 的三種狀態(tài)

pending (進行中)， 執(zhí)行了 new Promise() 命令后，promise實例就處于 pending 的狀態(tài)。

fullfilled(已成功)，promise 內(nèi)部執(zhí)行了 resolve 方法，promise實例處于fullfilled狀態(tài)，狀態(tài)不可改變了。

rejected(已失敗), promise 內(nèi)部執(zhí)行了reject 方法，promise 實例處于rejected狀態(tài)，同樣不可更改。

Promise.prototype 方法 then和catch 
new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("hello resolve");
    }, 500);
})
.then(val => {
    console.log(val);// hello resolve
}, err => {
    console.error(err);// 該條語句不被執(zhí)行
});

then最多有兩個參數(shù)，參數(shù)一為 resolve 后回調(diào)的函數(shù)，參數(shù)二為 reject 后的回調(diào)函數(shù)。then也可以只接收參數(shù)一。

new Promise((resolve, reject) => {
   setTimeout(() => {
       reject("hello reject");
   }, 500);
})
.then(val => {
   console.log(val);
}, err => {
   console.error(err);// hello reject
});

catch實際上是 then 函數(shù)的一種簡寫形式，當執(zhí)行 reject 后，可以被catch 的回調(diào)函數(shù)接收處理。

new Promise((resolve, reject) => {
    setTimeout(() => {
        reject("hello reject");
    }, 500);
})
.catch(err => {
    console.log(err); // hello reject
});
再談談 Promise 對象的異常處理

在 promise 內(nèi)部發(fā)生錯誤后不會被外層環(huán)境捕捉到。

try {
    new Promise((resolve, reject) => {
        console.log(e);
    });
} catch(e) {
    console.log("error is catched? ", e);// 該語句并未執(zhí)行
}

若 promise 內(nèi)部發(fā)生錯誤，會被自動的執(zhí)行reject。

new Promise((resolve, reject) => {
    console.log(e);
})
.catch(err => {
    console.log("error be rejected?", err);// error be rejected? ReferenceError: e is not defined
});
再來看看promise的鏈式調(diào)用吧 
let p = new Promise((resolve, reject) => {
    resolve("i am resolved");
})
.then(val => {
    return val;
});
console.log(p);// Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}

在 then 中 return 的值又變成了 promise對象。

p.then(val => {
    console.log(val);// i am resolved
});

這個也為鏈式調(diào)用提供了基礎。

Promise 的靜態(tài)方法 all race resolve reject all

all靜態(tài)方法接收promise 對象的數(shù)組，并返回一個 promise 對象。當數(shù)組中的所有元素都 resolve 時，結(jié)果promise被 resolve。若數(shù)組中有一個對象被 reject 了，結(jié)果promise對象被reject。本人經(jīng)常使用 all方法來處理多個 ajax 請求獲取數(shù)據(jù)的界面loading 效果。

let isLoading = true;
let p1 = fetch(url1).then(json => {
    // ....
});
let p2 = fetch(url2).then(json => {
    // ...
});
let p3 = fetch(url3).then(json => {
    // ...
});
Promise.all([p1, p2, p3]).then(() => {
    isLoading = false;
});
race

同樣接收一個數(shù)組,結(jié)果也是一個 promise 對象，當數(shù)組中的promise 對象有一個的狀態(tài)改變時，race方法的結(jié)果promise對象變?yōu)橄嗤臓顟B(tài)。具體應用場景筆者還沒有遇到過。若有人遇到過，請在下面留言告知一下，感激不盡。

resolve、reject

靜態(tài)函數(shù)Promise.resolve返回一個成功的promise對象，靜態(tài)函數(shù)Promise.reject返回一個拒絕狀態(tài)的 promise 對象。

refs

MDN Promise

【開發(fā)環(huán)境推薦】Cloud Studio 是基于瀏覽器的集成式開發(fā)環(huán)境，支持絕大部分編程語言，包括 HTML5、PHP、Python、Java、Ruby、C/C++、.NET 小程序等等，無需下載安裝程序，一鍵切換開發(fā)環(huán)境。 Cloud Studio提供了完整的 Linux 環(huán)境，并且支持自定義域名指向，動態(tài)計算資源調(diào)整，可以完成各種應用的開發(fā)編譯與部署。

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/88825.html

相關(guān)文章

  • ES6系列文章 異步神器async-await

    摘要：有兩個陌生的關(guān)鍵字，同時函數(shù)執(zhí)行結(jié)果似乎返回了一個對象。用來表示函數(shù)是異步的，定義的函數(shù)會返回一個對象，可以使用方法添加回調(diào)函數(shù)。如果的是對象會造成異步函數(shù)停止執(zhí)行并且等待的解決如果等的是正常的表達式則立即執(zhí)行。 視頻講解 關(guān)于異步處理，ES5的回調(diào)使我們陷入地獄，ES6的Promise使我們脫離魔障，終于、ES7的async-await帶我們走向光明。今天就來學習一下 async-a...

    miqt 評論0 收藏0

  • JS筆記

    摘要：從最開始的到封裝后的都在試圖解決異步編程過程中的問題。為了讓編程更美好，我們就需要引入來降低異步編程的復雜性。異步編程入門的全稱是前端經(jīng)典面試題從輸入到頁面加載發(fā)生了什么這是一篇開發(fā)的科普類文章，涉及到優(yōu)化等多個方面。 TypeScript 入門教程 從 JavaScript 程序員的角度總結(jié)思考，循序漸進的理解 TypeScript。 網(wǎng)絡基礎知識之 HTTP 協(xié)議 詳細介紹 HTT...

    rottengeek 評論0 收藏0

  • JavaScript 異步

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

    tuniutech 評論0 收藏0

  • ES6-7

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

    mudiyouyou 評論0 收藏0

  • ES6 系列之 Babel 將 Async 編譯成了什么樣子

    摘要：大約后輸出我們直接在官網(wǎng)的粘貼上述代碼，然后查看代碼編譯成什么樣子相關(guān)的代碼我們在系列之將編譯成了什么樣子中已經(jīng)介紹過了，這次我們重點來看看函數(shù)以上這段代碼主要是用來實現(xiàn)的自動執(zhí)行以及返回。 前言 本文就是簡單介紹下 Async 語法編譯后的代碼。 Async const fetchData = (data) => new Promise((resolve) => setTimeout...

    wangym 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<