async/await用法

1. async/await的基本用法

• async/await是ES7引入的新語(yǔ)法，可以更加方便的進(jìn)行異步操作
• async關(guān)鍵詞用于函數(shù)上（async函數(shù)的返回值是Promise實(shí)例對(duì)象）
• await關(guān)鍵子用于async函數(shù)當(dāng)中（await可以得到異步的結(jié)果）

async function queryData(id) {
    const ret = await axios.get('/data');
    return ret;
}
queryData.then(ret=>{
    console.log(ret)
})

示例：

// 配置請(qǐng)求的基準(zhǔn)URL地址
axios.defaults.baseURL = 'http:localhost:3000';
    //axios請(qǐng)求接口
    axios.get('adata').then(function(ret){
      console.log(ret.data)
    })
    //async請(qǐng)求接口  await后面是Promise實(shí)例對(duì)象
    async function queryData() {
      var ret = await axios.get('adata');
      // console.log(ret.data)
      return ret.data;
    }
    queryData().then(function (data) {
      console.log(data)
    })
//服務(wù)器端的接口
app.get('/adata', (req, res) => {
  res.send('Hello axios!')
})

2. async/await處理多個(gè)異步請(qǐng)求

• 第一個(gè)異步請(qǐng)求的結(jié)果
• 可以作為第二個(gè)異步請(qǐng)求內(nèi)部的參數(shù)，進(jìn)行判斷等數(shù)據(jù)操作。
• 形成鏈?zhǔn)疥P(guān)系

示例：

// 配置請(qǐng)求的基準(zhǔn)URL地址
axios.defaults.baseURL = 'http://localhost:3000';
    //async請(qǐng)求接口
    async function queryData() {
      var info = await axios.get('async1');
      //axios傳遞給服務(wù)器/async2接口的info.data參數(shù),用于接口內(nèi)部判斷
      //傳參格式：[ '地址？屬性名=屬性值' ]or [ ' 地址？對(duì)象= ' + '對(duì)象.屬性名']
      var ret = await axios.get('async2?info=' + info.data);
      return ret.data;
    }
    queryData().then(function(data){
      console.log(data)
    })
    
//服務(wù)器端的接口 
app.get('/async1', (req, res) => {
  res.send('hello')
})
app.get('/async2', (req, res) => {
  if (req.query.info == 'hello') {
    res.send('async1的結(jié)果確實(shí)是hello')
  } else {
    res.send('error')
  }
})