這篇文章給大家分享的是有關(guān)js中為什么要使用promise的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考。一起跟隨小編過來看看吧。
我們一直強(qiáng)調(diào)成都網(wǎng)站制作、網(wǎng)站建設(shè)對于企業(yè)的重要性,如果您也覺得重要,那么就需要我們慎重對待,選擇一個安全靠譜的網(wǎng)站建設(shè)公司,企業(yè)網(wǎng)站我們建議是要么不做,要么就做好,讓網(wǎng)站能真正成為企業(yè)發(fā)展過程中的有力推手。專業(yè)網(wǎng)站制作公司不一定是大公司,創(chuàng)新互聯(lián)公司作為專業(yè)的網(wǎng)絡(luò)公司選擇我們就是放心。js中的宏任務(wù)與微任務(wù)在面試過程中,基本面試官都會問你一些promise的問題,promise是es6的新內(nèi)容,主要是用來優(yōu)化異步的問題。筆試中經(jīng)常會讓你寫一些promise和setTimeout的執(zhí)行結(jié)果,這你就必須知道宏任務(wù)和微任務(wù)的概念了!
為什么要使用promise
如果你經(jīng)歷過以前的jquery開發(fā)項目,你會遇到以下問題:回調(diào)地獄
$.ajax({ ... success: function() { ... $.ajax({ ... success: function() { } }) ... } })
原因分析:
ajax請求嵌套,原因是我第二個請求依賴的參數(shù)在第一個請求的結(jié)果中,所以就得這么一直嵌套下去,ajax是異步的,不能再外面拿到里面的結(jié)果。這種代碼導(dǎo)致的問題就是調(diào)試?yán)щy,耦合性非常高,后期改動一個地方就頭疼!維護(hù)非常困難,代碼可讀性差。
于是乎就引入了promise對ajax進(jìn)行了優(yōu)化,axios就是基于promise的一個請求封裝庫,他們底層都是基于js原生的XMLHTTPREQUEST.
promise().then().catch()鏈?zhǔn)秸{(diào)用,多個請求可以promise().then().then()。
何為宏任務(wù),何為微任務(wù)?
思考這個問題時你必須知道javascript是一種單線程的腳本語言,也就是它的代碼正常只能從上往下依次執(zhí)行,一次只能做一件事,異步是通過回調(diào)函數(shù)來實現(xiàn)的。為何不把js設(shè)計成多線程的語言呢?語言的用途決定了它的特性,js最初是用來做表單驗證以及正則判斷的,和操作DOM元素的。如果js有多個線程,一個執(zhí)行DOM元素修改,另一個執(zhí)行刪除,那瀏覽器直接懵逼了,我到底該干啥???所以語言的用途決定了他的特性,但是瀏覽器是多線程的,除了主線程還有其他線程。
當(dāng)js主程序執(zhí)行時,先運(yùn)行主程序上的同步代碼,遇到setTimeout或setInterval就把它放入宏隊列中,遇到promise的回調(diào)就把它放到微隊列中,程序執(zhí)行先執(zhí)行主程序代碼,再執(zhí)行nextTick代碼,然后微任務(wù),最后宏任務(wù),任務(wù)隊列中的依次排隊執(zhí)行,async和await是配套使用的,await后面接一個promise對象,來看看下面這段代碼:
setTimeout(function(){console.log(1)},0); // 進(jìn)入宏任務(wù)隊列,最后執(zhí)行宏任務(wù) new Promise(function(resolve,reject){ console.log(2); //這句代碼在promise構(gòu)造器,同步執(zhí)行 resolve(); // 執(zhí)行了resolve再把任務(wù)放入微隊列 }).then(function(){console.log(3) }).then(function(){console.log(4)}); process.nextTick(function(){console.log(5)}); console.log(6); // 主程序代碼 // 輸出2,6,5,3,4,1 // 下面這個進(jìn)階代碼 setTimeout(function(){console.log(1)},0); // 進(jìn)入宏任務(wù)排序為1 new Promise(function(resolve,reject){ console.log(2); // promise中執(zhí)行完resolve()才會執(zhí)行then(),而這里的resolve在宏任務(wù)里,執(zhí)行完主程序代碼后,還得先執(zhí)行先進(jìn)入宏隊列中的程序 setTimeout(function(){resolve()},0) // 進(jìn)入宏任務(wù)排序為2 }).then(function(){console.log(3) }).then(function(){console.log(4)}); process.nextTick(function(){console.log(5)}); console.log(6); // 輸出的是 2 6 5 1 3 4
再看async and await中的執(zhí)行順序
代碼如下(示例):
async function async1() { console.log(1); await async2(); console.log(2); //這里要等await執(zhí)行成功才會執(zhí)行,進(jìn)入微任務(wù),排序1 } async function async2() { console.log(3); } console.log(4); //主程序代碼 setTimeout(function() { console.log(5); }, 0) //進(jìn)入宏任務(wù),最后執(zhí)行 async1(); new Promise(function(resolve) { console.log(6); // 這句同步執(zhí)行 resolve(); }).then(function() { console.log(7); //進(jìn)入微任務(wù),排序2 }); console.log(8); // 主程序代碼 // 輸出的是 4,1,3,6,8,2,7,5
js是單線程語言,它的用途決定了他的特性,異步操作通過事件循環(huán)機(jī)制,先執(zhí)行同步代碼,然后微任務(wù),最后宏任務(wù),兩個任務(wù)隊列里的任務(wù)排隊依次執(zhí)行。await后面的代碼必須等待promise返回結(jié)果再執(zhí)行下面代碼,await和async是generator函數(shù)的語法糖。
感謝各位的閱讀!關(guān)于js中為什么要使用promise就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
當(dāng)前標(biāo)題:js中為什么要使用promise-創(chuàng)新互聯(lián)
當(dāng)前地址:http://vcdvsql.cn/article18/iicgp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供電子商務(wù)、商城網(wǎng)站、網(wǎng)站制作、外貿(mào)建站、網(wǎng)站改版、品牌網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容