VUE异步事件处理

最近写项目遇到一些异步事件，js不按顺序执行了，导致某些值赋值不了，
下面展示一些 内联代码片。

Promise

  var myFirstPromise = new Promise(function(resolve, reject) {
        // 当异步代码执行成功时，我们才会调用resolve(...), 当异步代码失败时就会调用reject(...)
        // 在本例中，我们使用setTimeout(...)来模拟异步代码，实际编码时可能是XHR请求或是HTML5的一些API方法.
        setTimeout(function() {
          resolve('成功!') // 代码正常执行！
          console.log(556)
        }, 250)
      })
      myFirstPromise.then(()=>{
        console.log(123)
      //  这里放要等到处理的方法
      })

输出结果，
如果没有用Promise的话，直接setTimeout的话是异步处理，得到结果是123,556

Promise 自带的 API 提供了如下对象方法：

• Promise.all()：并发处理多个异步任务，所有任务都执行成功，才能得到结果。

• Promise.race(): 并发处理多个异步任务，只要有一个任务执行成功，就能得到结果。

Promise.all

const promise = new Promise((resolve, reject) => {
  //进来之后，状态为pending
  console.log('111') //这行代码是同步的
  //开始执行异步操作（这里开始，写异步的代码，比如ajax请求 or 开启定时器）
  setTimeout(() => {
    console.log(1)
    if (1) {
      console.log('000')
      resolve('haha') //如果请求成功了，请写resolve()，此时，promise的状态会被自动修改为fulfilled
    } else {
      reject('5551') //如果请求失败了，请写reject()，此时，promise的状态会被自动修改为rejected
    }
  }, 2000)
})

const promise1 = new Promise((resolve, reject) => {
  //进来之后，状态为pending
  console.log('111') //这行代码是同步的
  //开始执行异步操作（这里开始，写异步的代码，比如ajax请求 or 开启定时器）
  setTimeout(() => {
    console.log(1)
    if (0) {
      console.log('111')
      resolve('haha1') //如果请求成功了，请写resolve()，此时，promise的状态会被自动修改为fulfilled
    } else {
      reject('55512') //如果请求失败了，请写reject()，此时，promise的状态会被自动修改为rejected
    }
  }, 4000)
})

Promise.all([promise, promise1]).then(result => {
  console.log(result) // 输出数组['haha','haha1']
})

Promise.race 差不多，只是如果存在某一个resolve走不通的话，还能继续走，然而all就必须全部走通