vue中非同步函式async和await

2021-10-22 13:04:24 字數 2064 閱讀 8617

一,非同步函式async

1.1,async作為乙個關鍵字放到函式前面,用於表示函式是乙個非同步函式,因為async就是非同步的意思, 非同步函式也就意味著該函式的執行不會阻塞後面**的執行。 寫乙個async 函式。就是在函式前面加上async 關鍵字,來表示它是非同步的,那怎麼呼叫呢?async 函式也是函式,平時我們怎麼使用函式就怎麼使用。為了表示它沒有阻塞它後面**的執行,我們在async 函式呼叫之後加一句console.log。

async timeout() ,

test ()

執行結果:

1.2,接下來我們看一看timeout()執行返回了什麼? 把上面的 timeout() 語句改為console.log(timeout())。

async timeout() ,

test ()

執行結果:

1.3, 可以發現原來async 函式返回的是乙個promise 物件,如果要獲取到promise 返回值,我們應該用then 方法, 繼續修改**。

async timeout() ,

test () )

console.log('雖然我在後面,但是我先執行!')

}

執行結果:

1.4,我們獲取到了"timeout()方法執行。', ,同時timeout 的執行也沒有阻塞後面**的執行,和我們剛才說的一致。此時你可能注意到控制台中的promise 有乙個resolved,這是async 函式內部的實現原理。如果async 函式中有返回值當呼叫該函式時,內部會呼叫promise.resolve() 方法把它轉化成乙個promise 物件作為返回,但如果timeout 函式內部丟擲異常呢? 那麼就會呼叫promise.reject() 返回乙個promise 物件,繼續修改一下timeout 函式。

async timeout(flag)  else 

},test ()

執行結果:

如果函式內部丟擲錯誤,promise 物件有乙個catch 方法進行捕獲。

async timeout(flag)  else 

},test () )

// console.log('雖然我在後面,但是我先執行!')

}

執行結果:

二,同步函式await

1.1,await是等待的意思,**執行到 await 表示等一下,**就暫停到這裡,不再向下執行了,它等什麼呢?等後面的promise物件執行完畢,然後拿到promise resolve 的值並進行返回,返回值拿到之後,它繼續向下執行。。注意await 關鍵字只能放到async 函式裡面,在vue中開啟eslint 會檢測到。

calculate (var1) , 3000)

})},

async getcalcresult (params) ,

test ()

執行結果:

總結:asyncawait基於 promise 的。 使用 async 的函式將會始終返回乙個 promise 物件。 這一點很重要。

c Linq非同步async和Task函式管道流

之前我在研究async和task時發現,使用async和task的函式會打破函式管道,比如model.where select 但是我發現一種繼續使用非同步函式管道的方法。比如我自己給ienumerable型別開發了乙個whereasync擴充套件函式。如果我正常的使用model.whereasyn...

Async和Await非同步函式的示例分享

async非同步是c 5.0時代引入的 本文主要分享,有返回值和無返回值的async非同步函式的編寫方式,以及await的使用。這裡模擬了兩個耗時任務asyncmethod1和asyncmethod2,每個任務耗時5秒鐘。public static void asyncmethod1 public ...

Async和Await 非同步方法

async和await關鍵字是c 非同步程式設計的核心。通過使用這兩個關鍵字,你可以使用.net framework或windows runtime的資源建立乙個非同步方法如同你建立乙個同步的方法一樣容易。通過使用async和await定義的非同步方法,這裡被稱為非同步方法。非同步方法的特點 方法中...