async / await對異步的處理

雖然co是社區里面的優秀異步解決方案,但是并不是語言標準,只是一個過渡方案。ES7語言層面提供async / await去解決語言層面的難題。目前async / await 在 IE edge中已經可以直接使用了,但是chrome和Node.js還沒有支持。幸運的是,babel已經支持async的transform了,所以我們使用的時候引入babel就行。在開始之前我們需要引入以下的package,preset-stage-3里就有我們需要的async/await的編譯文件。

無論是在Browser還是Node.js端都需要安裝下面的包。

 npm install babel-core --savenpm install babel-preset-es2015 --savenpm install babel-preset-stage-3 --save

  

這里推薦使用babel官方提供的require hook方法。就是通過require進來后,接下來的文件進行require的時候都會經過Babel的處理。因為我們知道CommonJs是同步的模塊依賴,所以也是可行的方法。這個時候,需要編寫兩個文件,一個是啟動的js文件,另外一個是真正執行程序的js文件。

啟動文件index.js

require('babel-core/register');
require('./async.js');

  真正執行程序的async.js

const request = require('request');const options = {url: 'https://api.github.com/repos/cpselvis/zhihu-crawler',headers: {'User-Agent': 'request'}
};const getRepoData = () => {return new Promise((resolve, reject) => {request(options, (err, res, body) => {if (err) {reject(err);}resolve(body);});});
};async function asyncFun() {try {const value = await getRepoData();// ... 和上面的yield類似,如果有多個異步流程,可以放在這里,比如// const r1 = await getR1();// const r2 = await getR2();// const r3 = await getR3();// 每個await相當于暫停,執行await之后會等待它后面的函數(不是generator)返回值之后再執行后面其它的await邏輯。return value;} catch (err) {console.log(err);}
}asyncFun().then(x => console.log(`x: ${x}`)).catch(err => console.error(err));

  

注意點:

  • async用來申明里面包裹的內容可以進行同步的方式執行,await則是進行執行順序控制,每次執行一個await,程序都會暫停等待await返回值,然后再執行之后的await。
  • await后面調用的函數需要返回一個promise,另外這個函數是一個普通的函數即可,而不是generator。
  • await只能用在async函數之中,用在普通函數中會報錯。
  • await命令后面的 Promise 對象,運行結果可能是 rejected,所以最好把 await 命令放在 try...catch 代碼塊中。

其實,async / await的用法和co差不多,await和yield都是表示暫停,外面包裹一層async 或者 co來表示里面的代碼可以采用同步的方式進行處理。不過async / await里面的await后面跟著的函數不需要額外處理,co是需要將它寫成一個generator的。

promise.then().catch()的catch通過async/await怎么處理???

try {const value = await getRepoData();return value;} catch (err) {console.log(err);}

 牛逼解釋: https://segmentfault.com/a/1190000007535316

轉載于:https://www.cnblogs.com/smzd/p/8665214.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/249922.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/249922.shtml
英文地址,請注明出處:http://en.pswp.cn/news/249922.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

《SQL Server 2008從入門到精通》--20180717

目錄 1.觸發器1.1.DDL觸發器1.2.DML觸發器1.3.創建觸發器1.3.1.創建DML觸發器1.3.2.創建DDL觸發器1.3.3.嵌套觸發器1.3.4.遞歸觸發器1.4.管理觸發器1.觸發器 觸發器是一種特殊的存儲過程,與表緊密關聯。 1.1.DDL觸發器 當服務器或數據庫中發生數據定義語言&#xff…

主成分分析原理解釋(能力工場小馬哥)

主成分分析(Principal components analysis)-最大方差解釋 在這一篇之前的內容是《Factor Analysis》,由于非常理論,打算學完整個課程后再寫。在寫這篇之前,我閱讀了PCA、SVD和LDA。這幾個模型相近,卻都有自…

div/div作用

<div></div>主要是用來設置涵蓋一個區塊為主&#xff0c;所謂的區塊是包含一行以上的數據&#xff0c;所以在<div></div>的開始之前與結束后&#xff0c;瀏覽都會自動換行&#xff0c;所以夾在<div></div>間的數據&#xff0c;自然會與其前…

路由懶加載優化

首先得需要插件支持&#xff1a;syntax-dynamic-import import Vue from vue import VueRouter from vue-router /*import First from /components/First import Second from /components/Second*/Vue.use(VueRouter) //方案1 const first ()>import(/* webpackChunkName: &…

vue全面介紹--全家桶、項目實例

簡介 “簡單卻不失優雅&#xff0c;小巧而不乏大匠”。 2016年最火的前端框架當屬Vue.js了&#xff0c;很多使用過vue的程序員這樣評價它&#xff0c;“vue.js兼具angular.js和react.js的優點&#xff0c;并剔除了它們的缺點”。授予了這么高的評價的vue.js&#xff0c;也是開…

關于Keychain

1、Keychain 淺析 2、iOS的密碼管理系統 Keychain的介紹和使用 3.iOS開發中&#xff0c;唯一標識的解決方案之keyChainUUID 轉載于:https://www.cnblogs.com/KiVen2015/p/9341224.html

算法群模擬面試記錄

第一場&#xff1a;2018年12月30日&#xff08;周日&#xff09;&#xff0c;北京時間早上五點。 寫在最前面&#xff1a;好不容易五點爬了起來圍觀mock&#xff0c;結果早上周賽睡過去了&#xff0c;唉。orz。 面試官&#xff1a;wisdompeak&#xff0c;同學&#xff1a;littl…

js對象排序

Object.keys(objs).sort()可以獲取到排好序的keysvar objs {f: {id: 2,name: 2}, a: {id: 3,name: 3}, c: {id: 1,name: 1} }; // 自定義排序規則&#xff0c;按對象的id排序 var sortedObjKeys Object.keys(objs).sort(function(a, b) {return objs[b].id - objs[a].id; });…

吳恩達機器學習筆記 —— 9 神經網絡學習

本章講述了神經網絡的起源與神經元模型&#xff0c;并且描述了前饋型神經網絡的構造。 更多內容參考 機器學習&深度學習 在傳統的線性回歸或者邏輯回歸中&#xff0c;如果特征很多&#xff0c;想要手動組合很多有效的特征是不現實的&#xff1b;而且處理這么大的特征數據量…

js中字符串編碼函數escape()、encodeURI()、encodeURIComponent()區別詳解

1 escape()函數 定義和用法escape() 函數可對字符串進行編碼&#xff0c;這樣就可以在所有的計算機上讀取該字符串。 語法escape(string) 參數 描述string 必需。要被轉義或編碼的字符串。 返回值已編碼的 string 的副本。其中某些字符被替換成了十六進制的轉義序列。 說明該方…

【SRH】------node遵循的規范,模塊劃分

1.node遵循的是COMMONJS規范&#xff08;規范即規定如何導入導出&#xff09;1、導入&#xff1a;require 2、導出&#xff1a;module.exports2.模塊分類&#xff1a;1、核心模塊nodejs下載安裝完成后會自帶一些模塊&#xff0c;這些模塊不需要下載&#xff0c;可以直接通過r…

vue.js開發環境搭建

環境準備 Node.js Javascript的運行時環境npm Node.js下的包管理工具webpack 前端資源模塊化管理和打包工具vue-cli 腳手架構建工具cnpm npm的淘寶鏡像 Vue.js安裝 Node.js的安裝非常容易&#xff0c;首先從官網下載你所需操作系統的版本&#xff0c;然后一直下一步就ok&…

mysql數據庫刪除一條數據后還想讓新增數據從空缺id處開始

方法1&#xff1a; truncate table 你的表名 //這樣不但將數據全部刪除&#xff0c;而且重新定位自增的字段 方法2&#xff1a; delete from 你的表名 dbcc checkident(你的表名,reseed,0) //重新定位自增的字段&#xff0c;讓它從1開始 方法3&#xff1a; 如果你要保存你的數…

Object相關方法

const object1 {a: somestring,b: 42,c: false };console.log(Object.values(object1)); // expected output: Array ["somestring", 42, false]該Object.values()方法返回給定對象自己的可枚舉屬性值的數組&#xff0c;其順序與for...in循環提供的順序相同&#xf…

用Itextsharp 組件導出PDF 的文檔的方法

Itextsharp 是一個很強大&#xff0c;開源的&#xff0c;輕量級的 PDF 生成組件&#xff0c;官方網上好像沒有相應的API 說明文檔&#xff0c;以下是在工作中使用的心得與體會&#xff0c;并附上源碼&#xff0c;功能包含了pdf 的創建&#xff0c;table 的創建&#xff0c; 圖片…

正則基礎知識

創建正則表達式 1.使用new來創建 var exp new RegExp(box , gi );g 全局匹配 i 忽略大小寫 m 多行匹配2.使用字面量 var exp /box/gi; 直接用2個 / ; 在倆個斜杠后加上模式修飾符&#xff1b; 倆種創建方式比較: 1.使用字面量方式創建用的更加廣泛; 2.當要匹配的內容是變量時,…

詳解 vue-cli 的打包配置文件代碼

一、前言 對于webpack基礎不好&#xff0c;node指令不通的童鞋。估計對自己搭建Vue、react腳手架是相當頭疼的&#xff0c;有種無從下手的感覺。然而&#xff0c;從頭看這2塊&#xff0c;耗時太長&#xff0c;而且說實話得練才行&#xff0c;不練練手看不明白。那大多數人就采…

室內定位(一)

轉自&#xff1a;http://www.cnblogs.com/rubbninja/ 各種室內定位方法 具體的室內無線定位技術可以這樣來分類&#xff1a; 無線設備&#xff1a;WIFI、藍牙、ZigBee、RFID、UWB、LED、紅外線、超聲波、麥克風等定位信息&#xff1a;主要是RSS&#xff08;接收信號強度&#x…

不同瀏覽器css引入外部字體的方式

/*** 字體后綴和瀏覽器有關&#xff0c;如下所示* .TTF或.OTF&#xff0c;適用于Firefox 3.5、Safari、Opera * .EOT&#xff0c;適用于Internet Explorer 4.0 * .SVG&#xff0c;適用于Chrome、IPhone * 比如:*/ font-face {font-family: MyFont;/*定義字體名稱*/src: url(fon…

Promise實踐

var doSomething function() { return new Promise((resolve, reject) > { resolve(返回值); }); };let doSomethingElse function() { return 新的值; }doSomething().then(function () { return doSomethingElse(); }).then(resp > { console.warn(resp); console.wa…