摘要:是異步編程的一種解決方案,比傳統(tǒng)的解決方案回調(diào)函數(shù)和事件更合理和更強(qiáng)大。規(guī)定,對(duì)象是一個(gè)構(gòu)造函數(shù),用來(lái)生成實(shí)例。在同步調(diào)用下,回調(diào)函數(shù)一般是最后執(zhí)行的。
1、Promise 的含義
初識(shí)Promise,要從多方面去理解,可以直接百度Promise,只看別人博客的前面的含義介紹,先不深入看別人的博客,基本可以了解到:
2、同步、異步、回調(diào)函數(shù)相關(guān)概念promise原意:諾言; 許諾; 承諾;預(yù)示。
Promise 是異步編程的一種解決方案,比傳統(tǒng)的解決方案——回調(diào)函數(shù)和事件——更合理和更強(qiáng)大。鏈接描述
Promises 是一種 JavaScript 中處理異步代碼的方法,其實(shí) Promises 已經(jīng)存在多年,但是直到 ES2015 (ES6)才被標(biāo)準(zhǔn)化和引入,現(xiàn)在它們已經(jīng)在 ES2017(ES8) 中被 async(異步) 函數(shù)所取代和擴(kuò)展,可見(jiàn)發(fā)展之快。鏈接描述
一個(gè) Promise 就是一個(gè)對(duì)象,它代表了一個(gè)異步操作的最終完成或者失敗。鏈接描述
Promise對(duì)象用于異步操作,它表示一個(gè)尚未完成且預(yù)計(jì)在未來(lái)完成的異步操作。
ES6 規(guī)定,Promise對(duì)象是一個(gè)構(gòu)造函數(shù),用來(lái)生成Promise實(shí)例。
Async functions(異步函數(shù)) 使用 promises API 作為構(gòu)建塊,因此理解 Promises 是必須的,即使在較新的代碼中,你可能會(huì)使用 async(異步) 函數(shù)而不是promises 。鏈接描述
JavaScript的執(zhí)行環(huán)境是單線程。所謂單線程,是指JS引擎中負(fù)責(zé)解釋和執(zhí)行JavaScript代碼的線程只有一個(gè),也就是一次只能完成一項(xiàng)任務(wù),這個(gè)任務(wù)執(zhí)行完后才能執(zhí)行下一個(gè),它會(huì)阻塞其他任務(wù)。這個(gè)任務(wù)可稱為主線程。但實(shí)際上還有其他線程,如事件觸發(fā)線程、ajax請(qǐng)求線程等。
同步模式,即上述所說(shuō)的單線程模式,一次只能執(zhí)行一個(gè)任務(wù),函數(shù)調(diào)用后需等到函數(shù)執(zhí)行結(jié)束,返回執(zhí)行的結(jié)果,才能進(jìn)行下一個(gè)任務(wù)。如果這個(gè)任務(wù)執(zhí)行的時(shí)間較長(zhǎng),就會(huì)導(dǎo)致線程阻塞。
/* 例2.1 */ var x = true; while(x); console.log("don"t carry out"); //不會(huì)執(zhí)行 上面的例子即同步模式,其中的while是一個(gè)死循環(huán),它會(huì)阻塞進(jìn)程,因此第三句console不會(huì)執(zhí)行。 同步模式比較簡(jiǎn)單,也較容易編寫。但問(wèn)題也顯而易見(jiàn),如果請(qǐng)求的時(shí)間較長(zhǎng),而阻塞了后面代碼的執(zhí)行, 體驗(yàn)是很不好的。因此對(duì)于一些耗時(shí)的操作,異步模式則是更好的選擇。
異步模式,即與同步模式相反,可以一起執(zhí)行多個(gè)任務(wù),函數(shù)調(diào)用后不會(huì)立即返回執(zhí)行的結(jié)果,如果任務(wù)A需要等待,可先執(zhí)行任務(wù)B,等到任務(wù)A結(jié)果返回后再繼續(xù)回調(diào)。最常見(jiàn)的異步模式就數(shù)定時(shí)器了,我們來(lái)看看以下的例子。
/* 例2.2 */ setTimeout(function() { console.log("taskA, asynchronous"); }, 0); console.log("taskB, synchronize"); //while(true); -------ouput------- taskB, synchronize taskA, asynchronous 我們可以看到,定時(shí)器延時(shí)的時(shí)間明明為0,但taskA還是晚于taskB執(zhí)行。 這是為什么呢?由于定時(shí)器是異步的,異步任務(wù)會(huì)在當(dāng)前腳本的所有同步 任務(wù)執(zhí)行完才會(huì)執(zhí)行。 如果同步代碼中含有死循環(huán),即將上例的注釋去掉,那么這個(gè)異步任務(wù)就不會(huì)執(zhí)行,因?yàn)橥饺蝿?wù)阻塞了進(jìn)程。
回調(diào)函數(shù),提起異步,就不得不談?wù)劵卣{(diào)函數(shù)了。上例中,setTimeout里的function便是回調(diào)函數(shù)??梢院?jiǎn)單理解為:(執(zhí)行完)回(來(lái))調(diào)(用)的函數(shù)。
**WikiPedia對(duì)于callback的定義。** In computer programming, a callback is a piece of executable code that is passed as an argument to other code, which is expected to call back (execute) the argument at some convenient time. 可以看出,回調(diào)函數(shù)是一段可執(zhí)行的代碼段,它以「參數(shù)」的形式傳遞給其他代碼, 在其合適的時(shí)間執(zhí)行這段(回調(diào)函數(shù))的代碼。 **WikiPedia還定義** The invocation may be immediate as in a synchronous callback, or it might happen at a later time as in an asynchronous callback. 也就是說(shuō),回調(diào)函數(shù)不僅可以用于異步調(diào)用,一般同步的場(chǎng)景也可以用回調(diào)。 在同步調(diào)用下,回調(diào)函數(shù)一般是最后執(zhí)行的。而異步調(diào)用下,可能一段時(shí)間后執(zhí)行或不執(zhí)行(未達(dá)到執(zhí)行的條件)。3、Promise 的特點(diǎn)和基本用法
promise對(duì)象有兩個(gè)特點(diǎn):
對(duì)象的狀態(tài)不受外界影響,pending(進(jìn)行中)、fulfiled(已完成)、rejected(已失敗)
一旦狀態(tài)改變,就不會(huì)再變,任何時(shí)候都可以得到這個(gè)結(jié)果,狀態(tài)改變只有兩種可能,稱為(resolved)
基本用法:
es6規(guī)定,Promise對(duì)象是一個(gè)構(gòu)造函數(shù),用來(lái)生成Promise實(shí)例。 擴(kuò)展構(gòu)造函數(shù)回顧:特殊方法,創(chuàng)建對(duì)象時(shí)初始化對(duì)象,為對(duì)象成員變量賦初始值,與new一起使用。 一個(gè)類可以有多個(gè)構(gòu)造函數(shù) ,可根據(jù)其參數(shù)個(gè)數(shù)的不同或參數(shù)類型的不同來(lái)區(qū)分它們 即構(gòu)造函數(shù)的重載。 var promise = new promise(function(resove, reject){ // ... some code if (/*異步成功*/){ resove(value); } else{ reject(error);。 } });
簡(jiǎn)單例子1
例子用到了箭頭函數(shù),寫法很容易理解,可參考另一篇文章
let p= new Promise((resolve, reject)=>{ let a1="成功傳出去的對(duì)象"; let a2="失敗傳出去的對(duì)象"; var timer = setTimeout(function () { console.log("after resolve"); resolve(a1); reject(a2); console.log("after error"); }, 1000); }); p.then(value=>{ console.log(value); },error=>{ console.log(".then的第二個(gè)參數(shù)"); console.log(error) }); p.catch(error=>{ console.log(".catch"); console.log(error); });
上面例子的輸出效果,出現(xiàn)的第一行是Promise{
然后再次輸入p 按回車執(zhí)行打印出來(lái)p是這樣Promise{
然后點(diǎn)開(kāi)看 可以看到控制臺(tái)提示promiseStatus :resolved 說(shuō)明promise的狀態(tài)已經(jīng)成為了resolved
上面例子把resolve(a1)去掉,結(jié)果如下:
參考上面例子1
let p = new Promise(參數(shù)1),創(chuàng)造一個(gè)實(shí)例時(shí),接受一個(gè)函數(shù)作為參數(shù)1;
參數(shù)1,作為函數(shù),也接受兩個(gè)參數(shù)分別是resolve和reject。它們是兩個(gè)函數(shù),由 JavaScript 引擎提供,不用自己部署。注意:這兩個(gè)函數(shù)的作用就是改變Promise對(duì)象的狀態(tài),一個(gè)是成功,一個(gè)是失敗,一旦調(diào)用了其中一個(gè),狀態(tài)就不可改變和逆轉(zhuǎn);
Promise實(shí)例生成以后,可以用then方法分別指定resolved狀態(tài)和rejected狀態(tài)的回調(diào)函數(shù),即使用p.then()來(lái)進(jìn)一步的操作,注意:then()可以接受兩個(gè)參數(shù),這兩個(gè)參數(shù)也是函數(shù),第一個(gè)表示成功的操作,就是調(diào)用了resolve(a1)后會(huì)進(jìn)入,第二個(gè)表示失敗的操作,就是調(diào)用了reject(a1)后會(huì)進(jìn)入,但第二個(gè)可以省略;
p.catch和.then()第二個(gè)參數(shù)的效果是一樣,都會(huì)進(jìn)入;
例子1的resolve(a1)和reject(a2)同時(shí)存在時(shí),只有在前面的有用,可注釋第一個(gè)看失敗的效果;
例子中的resolve,reject只是個(gè)名字,其實(shí)可以隨便改,不建議改;
例子中p.then(value=>{console.log(value)},這里面的value也只是個(gè)名字,其實(shí)可以隨便改,不建議改;注意:value就是上面resolve(a1)中傳出來(lái)的a1,a1可以是任何對(duì)象,a2也是相同的道理。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/104255.html
摘要:本身就是的語(yǔ)法糖。類似于后面代碼會(huì)等內(nèi)部代碼全部完成后再執(zhí)行打印結(jié)果操作符用于等待一個(gè)對(duì)象。它只能在異步函數(shù)中使用。參考附在版本位中是可以直接使用的。持續(xù)更新中來(lái)點(diǎn)顆吧 async await本身就是promise + generator的語(yǔ)法糖。 本文主要講述以下內(nèi)容 async awiat 實(shí)質(zhì) async await 主要特性 async await 實(shí)質(zhì) 下面使用 pro...
摘要:本身就是的語(yǔ)法糖。類似于后面代碼會(huì)等內(nèi)部代碼全部完成后再執(zhí)行打印結(jié)果操作符用于等待一個(gè)對(duì)象。它只能在異步函數(shù)中使用。參考附在版本位中是可以直接使用的。持續(xù)更新中來(lái)點(diǎn)顆吧 async await本身就是promise + generator的語(yǔ)法糖。 本文主要講述以下內(nèi)容 async awiat 實(shí)質(zhì) async await 主要特性 async await 實(shí)質(zhì) 下面使用 pro...
摘要:本身就是的語(yǔ)法糖。類似于后面代碼會(huì)等內(nèi)部代碼全部完成后再執(zhí)行打印結(jié)果操作符用于等待一個(gè)對(duì)象。它只能在異步函數(shù)中使用。參考附在版本位中是可以直接使用的。持續(xù)更新中來(lái)點(diǎn)顆吧 async await本身就是promise + generator的語(yǔ)法糖。 本文主要講述以下內(nèi)容 async awiat 實(shí)質(zhì) async await 主要特性 async await 實(shí)質(zhì) 下面使用 pro...
摘要:現(xiàn)在不會(huì)用都不好意思說(shuō)自己是前端,為什么火起來(lái),一句話解決了回調(diào)嵌套和執(zhí)行順序問(wèn)題最重要的我感覺(jué)是解決順序問(wèn)題。 現(xiàn)在不會(huì)用Promise都不好意思說(shuō)自己是前端,Promise為什么火起來(lái),一句話解決了回調(diào)嵌套和執(zhí)行順序問(wèn)題最重要的我感覺(jué)是解決順序問(wèn)題。 不過(guò)開(kāi)始寫之前我們先看看,promise怎么解決問(wèn)題,怎么用。列舉一個(gè)順序加載圖片demo: //需求 加載三張圖片 img1,im...
閱讀 2423·2021-08-18 10:21
閱讀 2531·2019-08-30 13:45
閱讀 2161·2019-08-30 13:16
閱讀 2126·2019-08-30 12:52
閱讀 1372·2019-08-30 11:20
閱讀 2632·2019-08-29 13:47
閱讀 1630·2019-08-29 11:22
閱讀 2769·2019-08-26 12:11