資訊專欄INFORMATION COLUMN
摘要：則是把類似的異步處理對(duì)象和處理規(guī)則進(jìn)行規(guī)范化，并按照采用統(tǒng)一的接口來編寫，而采取規(guī)定方法之外的寫法都會(huì)出錯(cuò)。這個(gè)對(duì)象有一個(gè)方法，指定回調(diào)函數(shù)，用于在異步操作執(zhí)行完后執(zhí)行回調(diào)函數(shù)處理。到目前為止，已經(jīng)學(xué)習(xí)了創(chuàng)建對(duì)象和用，方法來注冊(cè)回調(diào)函數(shù)。
Promise
本文從js的異步處理出發(fā)，引入Promise的概念，并且介紹Promise對(duì)象以及其API方法。
js里的異步處理可以參考這篇文章
js是單線程的，
在js里，異步處理總共有四種方法，其中最常見的一種方法是采用回調(diào)函數(shù)的方式
function f1(callback){
setTimeout(function(){
callback();
},1000)
}
f1(f2);
另外除了回調(diào)函數(shù)，事件監(jiān)聽的機(jī)制也會(huì)進(jìn)行異步處理。任務(wù)的執(zhí)行不取決于代碼的順序，而是取決于事件是否會(huì)發(fā)生。
如果是業(yè)務(wù)邏輯不復(fù)雜還好說，可是如果業(yè)務(wù)邏輯很復(fù)雜的話，回調(diào)嵌套的很多，代碼書寫起來會(huì)變得很復(fù)雜很難看懂。
還有一個(gè)問題是，如果有多個(gè)異步操作，那么就存在一個(gè)處理順序的問題，代碼如何按照希望的順序執(zhí)行。
Promise是抽象異步處理對(duì)象以及對(duì)其進(jìn)行各種操作的組件。Promise并不是從js里出現(xiàn)的概念。
Promise則是把類似的異步處理對(duì)象和處理規(guī)則進(jìn)行規(guī)范化， 并按照采用統(tǒng)一的接口來編寫，而采取規(guī)定方法之外的寫法都會(huì)出錯(cuò)。
首先說，Promise是一個(gè)對(duì)象，所以說這個(gè)對(duì)象與js里的其他對(duì)象沒什么不一樣的。要說與眾不同的地方時(shí)，Promise對(duì)象充當(dāng)代理的作用，充當(dāng)異步操作和回調(diào)函數(shù)之間的中介
Promise的思想是：每次執(zhí)行一個(gè)異步操作以后，立刻返回一個(gè)Promise對(duì)象，因?yàn)槭橇⒖滩僮?，所以我們可以進(jìn)行同步操作流程。這個(gè)Promise對(duì)象有一個(gè)then方法，指定回調(diào)函數(shù)，用于在異步操作執(zhí)行完后執(zhí)行回調(diào)函數(shù)處理。
//換成Promise的寫法 new Promise(f5).then(f4).then(f3).then(f2).then(f1)
使用Promise，用同步的寫法處理異步操作的代碼，使得代碼清晰易懂，等一個(gè)異步函數(shù)處理完成之后，才會(huì)執(zhí)行下一個(gè)then里邊的函數(shù)。這樣就避免了前邊的多個(gè)回調(diào)可能引發(fā)的順序問題。
Promise接口前邊說過，Promise接口的作用是，返回一個(gè)Promise對(duì)象。
一個(gè)Promise對(duì)象有三種狀態(tài)
pending 異步操作未完成
resolve 異步操作已成功完成
reject 異步操作失敗
至于這三種關(guān)系的途徑可以描述為兩種
pending ---> resolve
pending ---> reject
這種變化只會(huì)出現(xiàn)一次。所以，意思是，一個(gè)異步操作結(jié)束之后只會(huì)有兩種狀態(tài)，成功or失敗。異步操作成功時(shí)，Promise對(duì)象返回一個(gè)值，對(duì)象狀態(tài)變?yōu)閞esolve，異步操作失敗時(shí)，對(duì)象狀態(tài)變?yōu)閞eject。
Promise對(duì)象用then方法添加回調(diào)函數(shù)，then方法支持鏈?zhǔn)秸{(diào)用。
promise.then(onFulfilled, onRejected)
then方法接受兩個(gè)參數(shù)，看名字就知道第一個(gè)參數(shù)是Promise對(duì)象狀態(tài)時(shí)resolve的時(shí)候調(diào)用，而第二個(gè)參數(shù)可以省略，表示Promise調(diào)用失敗狀態(tài)是reject的時(shí)候執(zhí)行這個(gè)回調(diào)。
除了then方法，還有一個(gè)專門處理異常的方法.
.catch 也可以理解為 promise.then(undefined, onRejected) 。
promise.catch(onRejected)
then和catch兩個(gè)方法是寫到了Promise對(duì)象的原型上的，每個(gè)Promise對(duì)象都可以調(diào)用。
Promise對(duì)象的生成ES6提供了原生的Promise對(duì)象構(gòu)造函數(shù)，用于生成Promise對(duì)象，
var promise = new Promise(function(resolve, reject){
// 異步操作的代碼
if (/* 異步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
Promise對(duì)象接收一個(gè)函數(shù)作為構(gòu)造函數(shù)的參數(shù)，這個(gè)函數(shù)同樣有兩個(gè)參數(shù)，這兩個(gè)參數(shù)是由js引擎提供的函數(shù)，不用自己來部署。
resolve函數(shù)的作用是把Promise對(duì)象的狀態(tài)從pending變?yōu)閞esolve，在異步操作成功的時(shí)候調(diào)用，并且將異步操作的結(jié)果作為參數(shù)傳過去。同樣的，reject函數(shù)的作用是把對(duì)象狀態(tài)從pending變成reject，在失敗的時(shí)候調(diào)用，并且傳遞結(jié)果參數(shù)。
接下來，當(dāng)Promise對(duì)象創(chuàng)建成功之后就可以用then方法鏈?zhǔn)秸{(diào)用了。
Promise對(duì)象其他方法一般情況下，我們會(huì)用構(gòu)造函數(shù)的方法創(chuàng)建Promise對(duì)象。但是，除此之外我們也會(huì)有其他方法創(chuàng)建。
靜態(tài)方法Promise.resolve(value)被認(rèn)為是new Promise方式創(chuàng)建Promise對(duì)象的快捷方式。
Promise.resolve(42).then(function(value){
console.log(value);
})
resolve()會(huì)讓對(duì)象狀態(tài)立即變成resolved，并且將形參立刻傳給下一個(gè)回調(diào)。
這個(gè)方法類似上一個(gè)方法，也是創(chuàng)建Promise對(duì)象的快捷方式，但是只會(huì)把Promise對(duì)象從pending變?yōu)閞ejected。參數(shù)是一個(gè)異常對(duì)象，傳遞給下一個(gè)catch方法或者then方法。
Promise.reject(new Error("BOOM!")).catch(function(error){
console.error(error);
});
到目前為止，已經(jīng)學(xué)習(xí)了創(chuàng)建Promise對(duì)象和用then，catch方法來注冊(cè)回調(diào)函數(shù)。如果只有一個(gè)Promise對(duì)象的話很好說，但是如果有多個(gè)Promise對(duì)象的時(shí)候要如何處理呢。
Promise.all 接收一個(gè) promise對(duì)象的數(shù)組作為參數(shù)，當(dāng)這個(gè)數(shù)組里的所有promise對(duì)象全部變?yōu)閞esolve或reject狀態(tài)的時(shí)候，它才會(huì)去調(diào)用 .then 方法。
Promise.race 只要有一個(gè)promise對(duì)象進(jìn)入 FulFilled 或者 Rejected 狀態(tài)的話，就會(huì)繼續(xù)進(jìn)行后面的處理。
function f1(v){
console.log(v);
return 2;
}
function f2(v){
console.log(v)
}
Promise.resolve(1).then(f1).then(f2);
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/83830.html
摘要：只能是同步函數(shù)，原因是無法捕捉異步函數(shù)的快照。除了這三個(gè)概念外，還有類比計(jì)算屬性，用于從派生出一些值分割較大的狀態(tài)樹，便于管理。處理表單可手動(dòng)監(jiān)聽或是使用帶的雙向綁定計(jì)算屬性。 一、Vue組件的創(chuàng)建 一般語法： Vue.component(tagName, options) 務(wù)必在根組件實(shí)例化之前注冊(cè)組件 組件options說明： data: 必須是一個(gè)函數(shù)，目的在于返回獨(dú)立的對(duì)象...
摘要：背景個(gè)人背景就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí)前端方向，自學(xué)，技術(shù)棧時(shí)間背景大概是在月日準(zhǔn)備好簡歷開始投遞秋招差不多已經(jīng)結(jié)束招聘崗位不多，投遞對(duì)象為大一些的互聯(lián)網(wǎng)公司事件背景第一個(gè)入職的是好未來的前端實(shí)習(xí)崗，待遇工 背景 個(gè)人背景 就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí) 前端方向，自學(xué)，vue技術(shù)棧 時(shí)間背景 大概是在11月9日準(zhǔn)備...
摘要：背景個(gè)人背景就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí)前端方向，自學(xué)，技術(shù)棧時(shí)間背景大概是在月日準(zhǔn)備好簡歷開始投遞秋招差不多已經(jīng)結(jié)束招聘崗位不多，投遞對(duì)象為大一些的互聯(lián)網(wǎng)公司事件背景第一個(gè)入職的是好未來的前端實(shí)習(xí)崗，待遇工 背景 個(gè)人背景 就讀于東北某普通二本院校計(jì)算機(jī)軟件工程專業(yè)，現(xiàn)大四，北京實(shí)習(xí) 前端方向，自學(xué)，vue技術(shù)棧 時(shí)間背景 大概是在11月9日準(zhǔn)備...
摘要：方法而對(duì)象本身，有一些方法查看的原型，發(fā)現(xiàn)它內(nèi)置有幾個(gè)方法參數(shù)處理成功的函數(shù)，處理錯(cuò)誤的函數(shù)返回值返回一個(gè)對(duì)象，所以可以鏈?zhǔn)秸{(diào)用。參數(shù)返回值的參數(shù)應(yīng)該是函數(shù)，傳入非函數(shù)則會(huì)發(fā)生值穿透。 前言 網(wǎng)上關(guān)于Promise的文章確實(shí)是非常多了，但是自己實(shí)踐的并不多，這里是針對(duì)自己的一個(gè)知識(shí)點(diǎn)小結(jié)和梳理，當(dāng)然啦如果有錯(cuò)誤歡迎提出^_^。 初定義 定義：Promise對(duì)象用于一個(gè)異步操作的最終完成...
摘要：因?yàn)槁酚蓪用媸軜I(yè)務(wù)影響很大，經(jīng)常修改一些功能的行為，所以后來大部分測(cè)試都是針對(duì)層面的單元測(cè)試。在我了解的過程中，我發(fā)現(xiàn)中文網(wǎng)絡(luò)上對(duì)的討論非常分散，于是我創(chuàng)建了中文社區(qū)，到年末已經(jīng)有個(gè)注冊(cè)用戶和個(gè)帖子了。 https://jysperm.me/2016/02/programming-of-2015/ 從 2014 年末開始開發(fā)的一個(gè)互聯(lián)網(wǎng)金融項(xiàng)目終于在今年三月份上線了，這是一個(gè) Node...
閱讀 2483·2021-11-16 11:45
閱讀 2457·2021-10-11 10:59
閱讀 2260·2021-10-08 10:05
閱讀 3850·2021-09-23 11:30
閱讀 2380·2021-09-07 09:58
閱讀 819·2019-08-30 15:55
閱讀 782·2019-08-30 15:53
閱讀 1931·2019-08-29 17:00
