亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

詳細聊聊對async/await的理解和用法

 更新時間:2022年07月15日 08:46:58   作者:前端之神  
隨著Nodev7的發(fā)布,越來越多的人開始研究據(jù)說是異步編程終級解決方案的 async/await,這篇文章主要給大家介紹了關(guān)于對async/await的理解和用法,文中通過實例代碼介紹的介紹的非常詳細,需要的朋友可以參考下

async/await是什么

async/await 是ES7提出的基于Promise的解決異步的最終方案。

async

async是一個加在函數(shù)前的修飾符,被async定義的函數(shù)會默認返回一個Promise對象resolve的值。因此對async函數(shù)可以直接then,返回值就是then方法傳入的函數(shù)。

// async基礎(chǔ)語法
async function fun0(){
    console.log(1);
    return 1;
}
fun0().then(val=>{
    console.log(val) // 1,1
})

async function fun1(){
    console.log('Promise');
    return new Promise(function(resolve,reject){
        resolve('Promise')
    })
}
fun1().then(val => {
    console.log(val); // Promise Promise
})

await

await 也是一個修飾符,只能放在async定義的函數(shù)內(nèi)??梢岳斫鉃榈却?/p>

await 修飾的如果是Promise對象:可以獲取Promise中返回的內(nèi)容(resolve或reject的參數(shù)),且取到值后語句才會往下執(zhí)行;

如果不是Promise對象:把這個非promise的東西當做await表達式的結(jié)果。

async function fun(){
    let a = await 1;
    let b = await new Promise((resolve,reject)=>{
        setTimeout(function(){
            resolve('setTimeout')
        },3000)
    })
    let c = await function(){
        return 'function'
    }()
    console.log(a,b,c)
}
fun(); // 3秒后輸出: 1 "setTimeout" "function"
function log(time){
    setTimeout(function(){
        console.log(time);
        return 1;
    },time)
}
async function fun(){
    let a = await log(1000);
    let b = await log(3000);
    let c = log(2000);
    console.log(a);
    console.log(1)
}
fun(); 
// 立即輸出 undefined 1
// 1秒后輸出 1000
// 2秒后輸出 2000
// 3秒后輸出 3000

async/await 的正確用法

// 使用async/await獲取成功的結(jié)果

// 定義一個異步函數(shù),3秒后才能獲取到值(類似操作數(shù)據(jù)庫)
function getSomeThing(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve('獲取成功')
        },3000)
    })
}

async function test(){
    let a = await getSomeThing();
    console.log(a)
}
test(); // 3秒后輸出:獲取成功

附:async與await一些注意關(guān)鍵點小結(jié)

  • await關(guān)鍵字必須位于async函數(shù)內(nèi)部
  • await關(guān)鍵字后面需要一個promise對象(不是的話就調(diào)用resolve轉(zhuǎn)換它)
  • await關(guān)鍵字的返回結(jié)果就是其后面Promise執(zhí)行的結(jié)果,可能是resolved或者rejected的值,注意最后執(zhí)行完的是個值。
  • 不能在普通箭頭函數(shù)中使用await關(guān)鍵字,需要在箭頭函數(shù)前面添加async
  • await用來串行的執(zhí)行異步操作,現(xiàn)實現(xiàn)并行可以考慮promise.all

async與await缺點

async函數(shù)中,如果有多個await關(guān)鍵字時,如果有一個await的狀態(tài)變成了rejected,那么后面的操作都不會繼續(xù)執(zhí)行,promise也是同理有這樣一個函數(shù)async

function getData()
{
let value=await get();
value++;
await set();//set完成后返回數(shù)據(jù)
return value;
}

直接調(diào)用

var value=getData();

是對于這個函數(shù)直接調(diào)用的時候并不是你想要的返回值,因為async方法返回的永遠是一個promise,即使開發(fā)者返回的是一個常量,也會被自動調(diào)用的promise.resolve方法轉(zhuǎn)換為一個promise。因此對于這種情況,上層調(diào)用方法也需要是async函數(shù),采用如下方法

async function xxxx(){
var value=await getData();
return value;
}

對于這種調(diào)用,如果還存在更高層次的方法調(diào)用,那么從底層的異步操作開始,一直到最頂層一個不需要返回值的函數(shù)為止,全部的方法都要變成async。

總結(jié)

到此這篇關(guān)于async/await理解和用法的文章就介紹到這了,更多相關(guān)async/await用法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論