ES6 - Promise

本文不是promise的基础教程。是我个人对promise的一些知识点。

 

1.Promise的状态

Promise有三种状态： pending   fulfilled  rejected
初始状态为 pending,pending可以变为fulfilled，或者变成rejected。但是状态变化完成后不可以再变化。

所以如果在函数里Promise接受的函数中写了多个reslove()，也只能执行第一个噢

 

2.Promise的链式调用

首先创建两个Promise对象

let state = [true, false]
function getA () {
  return new Promise((reslove, reject) => {
    setTimeout(()=> {
      let a = Math.random()
      console.log('a', a)
      let ar = a.toString().slice(0,5)
      let as = state[Math.round(a)]
      if(as) {
        reslove(ar)
      } else{
        reject(ar)
      }
    }, 100)
  })
}

function getB () {
  return new Promise((reslove, reject) => {
    setTimeout(()=> {
      let b = Math.random()
      console.log('b', b)
      let br = b.toString().slice(0,5)
      let bs = state[Math.round(b)]
      if(bs) {
        reslove(br*2)
      } else{
        reject(br*2)
      }
    }, 1000)
  })
}

 

进行链式调用。

getA().then(data=> {
  console.log('Asucess', data)
  return getB()
}).catch (data=> {
  console.log('Afail', data)
  return false
}).then(data=> {
  if(data) {
    console.log('Bsucess' ,data)
  } else {
  console.log(' is error ')
  }
}).catch (data=> {
  console.log('Bfail', data)
})

在以上代码中，使用了两次then()方法。

第一个then()方法返回了一个新的Promise，所以第二个.then()就是新的Promise对象的回调了。

有人可能会问，如果第一个then()方法没有返回的不是一个Promise呢？

那就会通过Promise.reslove()方法把返回值变成Promise对象。

// Promise.resolve的用法
let a = Promise.resolve(123)

a.then((result) => {
    console.log(result)   // 123
})

let b = Promise.resolve({name:'xiaoming', age:18})

b.then((result) => {
    console.log(result)   // {name:'xiaoming', age:18}
})

 

 

3.Promise.all()&Promise.race()

Promise.all()是所有的promise状态改变后执行，race是其中一个改变就执行

 Promise.all([getA(), getB()]).then(function (results) {
    console.log(results); // 获得一个Array: [ar的值, br的值]
});
Promise.race([getA(), getB()]).then(function (results) {
    console.log(results); // ar的值
});

 

 

4.微任务

Promise 的回调函数属于异步任务，会在同步任务之后执行。但是，Promise 的回调函数不是正常的异步任务，而是微任务（microtask）。它们的区别在于，正常任务追加到下一轮事件循环，微任务追加到本轮事件循环。这意味着，微任务的执行时间一定早于正常任务。

setTimeout(function() {
  console.log(1);
}, 0);

new Promise(function (resolve, reject) {
  resolve(2);
}).then(console.log);

console.log(3);
// 3
// 2
// 1