async/await的基本用法
這是一個用同步的思維來解決異步問題的方案,當前端接口調用需要等到接口返回值以后渲染頁面時。
- async/await是ES7引用的新語法,可以更加方便的進行異步操作
- async關鍵子用於函數上(async函數的返回值是Promise實例對象)
- await關鍵字用於async函數當中(await可以得到異步的結果,后跟Promise實例對象)
async的用法,它作為一個關鍵字放到函數前面,用於表示函數是一個異步函數,因為async就是異步的意思, 異步函數也就意味着該函數的執行不會阻塞后面代碼的執行,async 函數返回的是一個promise 對象。
await的含義為等待。意思就是代碼需要等待await后面的函數運行完並且有了返回結果之后,才繼續執行下面的代碼。這正是同步的效果
// async function queryData() { // var ret = await axios.get('adata'); // // console.log(ret.data) // return ret.data; // } async function queryData() { var ret = await new Promise(function(resolve, reject){ setTimeout(function(){ resolve('nihao') },1000); }) // console.log(ret.data) return ret; } queryData().then(function(data){ console.log(data) })
async/await處理多個異步請求
第二個接口需要調用第一個接口獲取的數據
使用async/await就能像平時一樣將所需要的代碼一條一條的運行
async function queryData() { var info = await axios.get('async1'); var ret = await axios.get('async2?info=' + info.data); return ret.data; } queryData().then(function(data){ console.log(data) })