介绍

Promise对象，用来处理异步操作的，可以让异步调用的时候更加美观便理解。

可以解决的问题

1、回调地狱：

在一个异步请求内部继续使用异步操作，嵌套的异步操作需要等待上层的异步操作完成，会陷入不断的嵌套导致程序乱套。
如下代码：

$.ajax({
  url:'https://www.lxtian.com/xxx',
  type:'get',
  success:res=>{
    $.ajax({
      url:'https://www.lxtian.com/xxx',
      type:'get',
      success:res=>{
        //...
        //...
      }
    })
  }
})

2、异步数据的关联问题

如某个异步操作需要使用到另外一个异步的数据，那么使用原始的方法，会导致数据错乱，处理上更复杂。
为了解决上述的问题，这个时候就可以用到Promise。
Promise有三种状态：pending（进行中），resolved（成功执行），rejected（失败执行）。

resolved状态
这个过程我们叫做resolve，即已处理，决定执行这个过程后，后续处理的方式为then()。 可以直接理解为“然后”的意思

rejected状态
这个过程我们叫做reject，即已拒绝，当决定执行这个过程后，后续处理的方式为catch()。 特别注意的是，如果不写catch()并且执行了这个过程，会在控制台报错误，并且会中断之后的操作

基本用法

demo描述：小明和朋友打赌，以硬币正反面决胜负

function xiaoming(){
  return new Promise((resolve,reject)=>{
    //假设0为硬币掉了，1为正面，2为反面
    let num=Math.floor(Math.random()*3);
    if(num==1){
      resolve(true);
    }else if(num==2){
      resolve(false)
    }else{
      reject('手滑了，硬币掉了')
    }
  })
}
xiaoming().then(result=>{
  //假设0为硬币掉了，1为正面，2为反面
  if(result==true){
    console.log('恭喜小明赢啦！')
  }else{
    console.log('很遗憾小明输了...')
  }
}).catch(error=>{
  console.log(error);
});

链式调用

即：按顺序执行，执行完毕才会向下执行，如下

function A() {
    return new Promise((resolve,reject) => {
        let a="a";
        if(a=="a"){
            console.log("我是"+a);
            resolve();
        }else{
            reject("a出错了");
        }
    });
}

function B(){
    return new Promise((resolve,reject)=>{
        let b="b";
        if(b=="b"){
            console.log("我是"+b);
            resolve();
        }else{
            reject("b出错了");
        }
    });
}

function C(){
    return new Promise((resolve,reject)=>{
        let c="c";
        if(c=="c"){
            console.log("我是"+c);
            resolve();
        }else{
            reject("c出错了");
        }
    });
}
A().then(B).then(C);

上述代码我创建了3个构造函数，按照顺序a、b、c顺序执行
控制台输出为：

Promise.all()

Promise.all()可以让多个函数同时执行，而不是和then那样执行一个才会继续下一个。
参数为一个数组，数组内放置不同的函数名
语法：

Promise.all([fun1,fun2,fun3]);

demo：三名同学跑步，同时起步

function fun1() {
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      console.log('f1跑完了')
    }, 1000)
  })
}
function fun2() {
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      console.log('f2跑完了')
    }, 1500)
  })
}
function fun3() {
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      console.log('f3跑完了')
    }, 2000)
  })
}
Promise.all([fun1(), fun2(), fun3()])