promise

Promise是什么？

Promise 是异步编程的一种解决方案： 从语法上讲，promise是一个对象，从它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果。 promise有三种状态： pending(等待态)，fulfiled(成功态)，rejected(失败 态)；状态一旦改变，就不会再变。创造promise实例后，它会立即执行

Promise是为了解决什么问题？

• 同步的方式写异步的代码，用来解决回调地狱问题。
• 此外，promise对象提供统一的接口，使得控制异步操作更加容易。
  • Promise是一个构造函数，对外提供统一的 API，自己身上有all、race、reject、resolve方法，原型上有then、catch等方法。

下面是一个promise的示例：

// Promise接收一个方法参数，这个方法有两个参数；resolve和reject；也是方法；执行resolve会触发promise的then方法；中reject会执行promise的catch方法
let p = new Promise((resolve, reject) => {
  setTimeout(() => {
    if(Math.random() > 0.5) {
      resolve('成功');
    } else {
      reject('失败');
    }
  }, 2000)
}).then(data => {
  console.log(data);
}).catch(err => {
  console.log(err);
})

把一个回调函数改成链式调用：

回调函数：

let callback = function (data) {
  console.log(data);
}
let callback2 = function (data, cb) {
  setTimeout(() => {
    cb(data);
  }, 2000)
}
let asyncFun = function (cb){
  setTimeout(() => {
    cb('asyncFun', callback);
  }, 2000)
}
asyncFun(callback2);

用promise改成链式调用：

let callback = function (data) {
  // do some
  return Promise.resolve(data)
}
let callback2 = function (data) {
  return new Promise(resolve => {
    setTimeout(() => {
      // do some
      resolve(data);
    }, 2000)
  })
}
let asyncFun = function (){
  return new Promise(resolve => {
    setTimeout(() => {
      // do some
      resolve('asyncFun');
    }, 2000)
  })
}
asyncFun()
.then(data => {
  return callback2(data);
})
.then(data => {
  return callback(data)
})
.then(data => {
  console.log(data);
})

promise.all的用法

所有promise执行完了，才返回

let p1 = new Promise(resolve => {
  setTimeout(() => {
    resolve('p1');
  }, 1000)
})
let p2 = new Promise(resolve => {
  setTimeout(() => {
    resolve('p2');
  }, 2000)
})
Promise.all([p1,p2]).then(data => {
  console.log(data); // [p1, p2]
})

promise.race的用法

谁先执行完就返回谁

let p1 = new Promise(resolve => {
  setTimeout(() => {
    resolve('p1');
  }, 1000)
})
let p2 = new Promise(resolve => {
  setTimeout(() => {
    resolve('p2');
  }, 2000)
})
Promise.race([p1,p2]).then(data => {
  console.log(data); // p1
})

promise.resolve和promise.resolve的用法

可以让函数链式调用

let fn = function () {
  let num = Math.random();
  if (num > 0.5) {
    return Promise.resolve('> 0.5')
  } else {
    return Promise.reject('< 0.5')
  }
}
fn().then(data => {
  console.log(data);
}).catch(err => {
  console.log(err);
}).finally(() => {
  console.log('执行完成');
})