vuejs学习5.4 ES6中的promise

promise的使用过程

//参数：函数（resolve, reject）
  //resolve, reject本身又是函数
  new Promise((resolve, reject)=>{
    //成功时调用resolve
    resolve()
  }).then( data =>{
    console.log('Hello world');
  })

new Promise((resolve, reject)=>{
    //失败时调用reject
    reject()
  }).then(data =>{
    console.log('Hello world');
  }).catch(err =>{
    console.log('err');
  })

new Promise((resolve, reject)=>{
    resolve()
  }).then(()=>{
    console.log('Hello world');
    return new Promise(((resolve, reject) => {
      resolve()
    }))
  }).then(()=>{
    console.log('Hello world');
  })

promise的三种状态

当开发中有异步操作时，就可以给异步操作包装一个promise，在异步操作之后有三种状态，
1，pending等待状态，比如正在进行网络请求，或者定时器没到时间
2，fulfill满足状态，当我们主动回调了resolve时，处于该状态，并且会回调.then()
3，reject拒绝状态，当我们回调了reject时，就处于该状态，并且会回调catch()

promise的链式调用

new Promise((resolve, reject)=>{
    setTimeout(()=>{
      resolve('Hello ');
    },2000)
  }).then(res =>{
    console.log(res);
    return new Promise((resolve => {
      resolve(res+'world ')
    }))
  }).then(res=>{
    console.log(res);
  })

后面没有使用异步操作时可以简写

  new Promise((resolve, reject)=>{
    setTimeout(()=>{
      resolve('Hello ');
    },2000)
  }).then(res =>{
    console.log(res);
    return Promise.resolve(res+'world ')
  }).then(res=>{
    console.log(res);
  })

可以继续简写

new Promise((resolve, reject)=>{
    setTimeout(()=>{
      resolve('Hello ');
    },2000)
  }).then(res =>{
    console.log(res);
    return res+'world '
  }).then(res=>{
    console.log(res);
  })

reject简写

new Promise((resolve, reject)=>{
    setTimeout(()=>{
      resolve('Hello ');
    },2000)
  }).then(res =>{
    console.log(res);
    return Promise.reject(res+'world ')
  }).catch(res=>{
    console.log(res);
  })

all方法使用

Promise.all([
      new Promise(((resolve, reject) => {
        setTimeout(()=>{
          resolve('Hello1 ');
        },2000)
      })),
      new Promise(((resolve, reject) => {
        setTimeout(()=>{
          resolve('Hello2 ');
        },2000)
      }))
  ]).then(results =>{
    console.log(results);
  })

all方法：在内部多个异步请求全部完成后才会调用then()，可以实现多个请求完成才能实现的功能