es6 async和await

来源:https://www.cnblogs.com/czkolve/archive/2019/05/18/10886035.html
-Advertisement-
Play Games

es7 async和await ,作為genertor函數語法糖,在使用上比generator函數方便的,Generator 函數就是一個封裝的非同步任務,或者說是非同步任務的容器。非同步操作需要暫停的地方,都用yield語句註明. generator將非同步的流程標記的很簡潔,但是流程執行卻並不方便,所有 ...


  es7 async和await ,作為genertor函數語法糖,在使用上比generator函數方便的,Generator 函數就是一個封裝的非同步任務,或者說是非同步任務的容器。非同步操作需要暫停的地方,都用yield語句註明.

  generator將非同步的流程標記的很簡潔,但是流程執行卻並不方便,所有我們需要藉助Generator的自執行下函數。Thunk 函數可以用於generator函數的自流程管理

   async和await 作為generator的語法糖,自帶自執行器,相對於generator具有更好的語義,yield後面只能時promise,async,await 具有更好的適用性,並不明確規定是promise,async的返回的是promise

  1.asycn和await的基本使用

    async如果遇到await就會等待,等待其執行結果,才會往下繼續執行函數內部語句

/* 非同步執行方法 */
function timeout(ms) {
    return new Promise((res)=>{
        console.log('settimeout')
        setTimeout(res,ms)
    })
}
/* await 只能在async定義的函數內部使用 */
async function asyncpriint(value,ms) {
    timeout(ms);
    console.log(value);
}
asyncpriint('hello world',2000);
// 先輸出settimeout等待2m鐘輸出hello world
// 如果去掉await,輸出settimeout並且不等待直接輸出hello world

  async函數返回的是一個promise

/* async返回時最終會轉成一個promise */
async function donow() {
    return 'czklove'
}
async function donow2 () {
    return new Promise(res=>{
        res('czklove')
    })
}
async function donow3 () {
    return Promise.resolve('czklove')
}
donow().then((val)=>{
    console.log(val)
})
// 輸出czklove
donow2().then((val)=>{
    console.log(val)
})
// 輸出czklove
/* 2和3是等價的,Promise.resolve 返回一個promise */
donow3().then((val)=>{
    console.log(val)
})
//輸出czklove
// 輸出輸出czklove
/* donow和donow2是等價的
    也就是說返回值是一個值的話,他會自動轉化成promise
 */
View Code

  async返回的promise對象的狀態變化

/* resolve */
async function promiseresolve(){
    await Promise.resolve('czkloveresolve')
    return 'czklove1'
}
/* rejuect */
async function promisereject(){
    await Promise.reject('czkloverejuct')
    console.log(123)
    return 'czklove2'
}
/* 內部都是resolve 
   一直執行下去
*/
promiseresolve().then(res=>{
    console.log('resolve'+res)
},rej=>{
    console.log('reject'+rej)
})
// resolveczklove1

/* 
    內部其中一個await是reject,則直接返回,不會再執行下去,並且返回值是rejuect的值
 */
promisereject().then(res=>{
    console.log('resolve'+res)
},rej=>{
    console.log('reject'+rej)
})
// 不會執行console.log(123)
// rejectczkloverejuct

  await  命令後面是一個promise對象,返回該對象的結果,如果不是promise,值直接放回該值

    如果後面是一個帶有then 方法的對象,那麼會將其等同於promise

    await 後面的promise如果執行了rejuect 則整個函數終止,並且返回該對象的結果,返回的promise對象的狀態也是rejuect的

    如果我們想繼續執行下去,則可以將reject的promise 放入try catch 模塊中,另外一種是後面跟.catch 方法

/* 定義一個async 函數 */
async function awaitfc() {
    try {
        /* 放入try 和 catch 中 reject 不會終止函數執行 */
        await Promise.reject('czklove')
    } catch (e){

    }
    /* .catch 也可以使 reject 不會終止函數執行*/
    await Promise.reject('czklove').catch((e)=>{
        console.log(e)
    })
    return 'jgczklove'
}
awaitfc().then(val=>{
    console.log(val)
})
//czklove async.js
View Code

  函數的併發執行或繼發執行

/* 定義一個async 函數 */
let i = 1;
function settime(ms) {
    return new Promise((res)=>{
        setTimeout(()=>{
            res ('123'+(i++))
        },ms)   
    })
}
/* 繼發執行 */
async function funa() {
    let val1 = await settime(2000)
    console.log(val1)
    let val2 = await settime(2000)
    console.log(val2)
    let val3 = await settime(2000)
    console.log(val3)
    console.log('1111')
}
/* 併發執行 */
async function funa2() {
    let val1 = settime(2000);
    let val2 = settime(3000);
    let val3 = settime(2000);
    console.log(await val1)
    console.log(await val2)
    console.log(await val3)
    console.log(2222)
}
funa();
/* 
繼發執行
結果是順序的
    每隔2秒 輸出1231 1232 1233 ,最終輸出1111
*/
funa2();
/* 
併發
val1 val2 val3 輸出結果順序是不定的,但是可以確認,最終才輸出2222
 */

  使用promise.all 也可以達到併發執行


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 本文以一個簡單的小例子,簡述在微信小程式開發中左右分欄功能的實現方式,主要涉及scroll-view ,列表數據綁定,及簡單樣式等內容,屬於初級入門內容,僅供學習分享使用。 ...
  • 一般我們在Android開發當中如果會對一些數據類進行解析,那麼則需要寫出一個JavaBean的類,比如在進行json解析的時候,就需要使用這個類進行數據的處理,下麵是我們的JavaBean的模板代碼: ...
  • 知名數位博主@數位閑聊站放出了一張高通驍龍730處理器的跑分成績,高達20萬分,性能還是不錯的。 據悉驍龍730通過直觀的照片拍攝、卓越的游戲體驗和優化的性能,將業界領先的終端側AI技術帶入移動體驗。通過 提供過去僅在驍龍8系終端支持的技術,驍龍730實現了全新的體驗升級。 AI方面:Qualcom ...
  • 使用手機上的程式,來分享/發送,比如QQ的“發送到我的電腦”。 1、分享/發送文本內容 通用步驟: 首先將Intent的cation設置為Intent.ACTION_SEND, 其次根據分享的內容設置不同的Type, 然後根據不同的社交平臺設置相關Extras, 最後創建並啟動選擇器 2、分享/發送 ...
  • 首次使用博客,很多東西都在探索,第一篇文章也不知道發佈點什麼,就隨便寫寫,是在word裡面寫的,也懶得排版,將就這用吧。 閑著沒事找了酷狗的API寫了個簡單的靜態網頁,完成了搜索,展示,播放功能。就想著給搜索框寫一個搜索推薦的下拉列表框,思路很明確,不寫了畫圖 代碼如下 樣式表 可是在引用樣式表的時 ...
  • 前言 要正確理解this,首先得理解執行上下文,這裡推薦湯姆大叔的 "執行上下文" ,因為 是在運行代碼時確認具體指向誰,箭頭函數除外。 全局作用域中的this : 每個 文件都是一個模塊, 指向空對象( ) 當然也有些意外,比如下麵這種情況: 瀏覽器端 : 指向 。 函數作用域中的this 這裡分 ...
  • 這個問題是解決基於 vue 和 electron 的開發中使用 vuex 的 dispatch 無效的問題,即解決了 Please, don't use direct commit's, use dispatch instead of this. 問題。先允許我梳理一下目錄結構,以便閱讀的時候不會一 ...
  • 經過前面幾次的學習,已經可以做下小功能,今天要實現的事用戶註冊路由。 一、users_model.js 功能:定義用戶對象模型 二、users_controller.js 功能:為Express伺服器實現用戶註冊的路由 三、signup.html 用戶註冊頁面 四、routes.js 功能:為Exp ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...