Promise用法

  2. //统一获取多个异步请求返回的数据
  3. testPromiseAll(){
  4.     let p1 = this.getAjax1(),
  5.         p2 = this.getAjax2();
  6.     Promise.all([p1,p2]).then( (dataArray) => {
  7.         console.log(dataArray);
  8.     })
  9. }
  10. //互相不关联的ajax请求
  11. getAjax1(){
  12.     return new Promise( (resolve,reject) => {
  13.         this.$axios(url).then( (response) => {
  14.             ....数据操作返回需要得到的data
  15.             //ajax请求成功后调用resolve函数将data返回
  16.             resolve(data);
  17.         })
  18.         .catch(error){
  19.             //失败调用reject函数
  20.             reject(error);
  21.         }
  22.     })
  23. }

async、await、promise

async

  • 作为一个关键字放在函数前面，用于表示函数是一个异步函数，因为async就是异步的异步，异步函数也就是意味着这个函数的执行不会阻塞后面代码的执行。
  • 表示函数异步，定义的函数会返回一个promise对象，可以使用then方法添加回调函数。

  • 如果async内部发生错误，使用 throw 抛出，catch捕获

    await

  • await: 是等待的意思，它后面可以放任何表达式，通常是一个promise对象的表达式。用来等待 Promise 对象的状态被 resolved。await若等待的是promise就会造成异步函数停止执行并且等待 promise的状态变为resolved,如果是正常的表达式则立即执行。

  • 注意await关键字，只能放在async函数里面,不能单独使用。

    Promise

  • Promise : 对象用于表示一个异步操作的最终状态（完成或失败），以及该异步操作的结果值。它有三种状态：pending，resolved，rejected。Promise从pending状态改为resolved或rejected状态只会有一次，一旦变成resolve或rejected之后，这个Promise的状态就再也不会改变了。

  • 通过resolve(retValue)传入的retValue可以是任何值，null也可以，它会传递给后面的then方法里的function去使用。通过rejected（err）传入的err理论上也是没有限制类型的，但我们一般都会传入一个Error，比如reject(new Error(“Error”)) ```javascript async function demo(flag){
    1.   if(flag){
    2.   return 'hello world!!';
    }else{
    1.   throw "happend err!";
    } } console.log(demo(1)); demo(0).then((val)=>{ console.log(val); }).catch((val)=>{ console.log(val); }); console.log(‘first exec’); // function demo2(){ return new Promise((resolve, reject) => {
    1.       resolve('hello promise!');
    }); } (async function exec(){ let res = await demo2(); console.log(res); //hello promise! })(); // function sleep(second) { return new Promise((resolve, reject) => {
    1.   setTimeout(() => {
    2.       resolve('request done! '+ second + Math.random());
    3.   }, second);
    }) } async function bugDemo() { console.log(await sleep(2000)); console.log(await sleep(3000)); console.log(await sleep(1000)); console.log(‘clear the loading~’); } bugDemo(); / request done! 20000.9130830570273656 request done! 30000.5404841472398161 request done! 10000.26831404663460434 clear the loading~ /

```