使用回调函数处理异步函数的问题

*   回调地狱

     在处理异步函数的过程中，回调函数嵌套回调函数，多次嵌套后，造成回调地狱，代码十分难    懂，复杂。

例如以下案例：

 *  假设一个一个女孩要养一只狗需要以下所有人同意：
 *      1.女孩的男朋友先同意
 *      2.女孩的父亲也要同意
 *      3.女孩的母亲也要同意
 *  
 * 
 *    每个人同意都需要一段时间的思考，而且有可能不同意。
setTimeout(function () {
  if (Math.random() > 0.5) {
    console.log("女孩同意了");
    setTimeout(function () {
      if (Math.random() > 0.5) {
        console.log("女孩的父亲同意了");
        setTimeout(function () {
          if (Math.random() > 0.5) {
            console.log("女孩的母亲同意了");
          } else {
            console.log("女孩的男朋友不同意");
          }
        }, 1000)
      } else {
        console.log("女孩的父亲不同意");
      }
    }, 1000)
  } else {
    console.log("女孩的母亲不同意");
  }
}, 1000)

*   Promise 

      ES6新增的类。专门用来解决回调地狱问题的。

用 Promise 解决以上案例

/**
 * 使用Promise解决回调地狱。
 * 
 */
function fn(){
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      if (Math.random() > 0.5) {
        resolve();
      } else {
        reject();
      }
    }, 1000)
  })
}

let p1 = fn();

/**
 * catch 默认也会返回当前的Promise对象。
 *  手动return一个空的Promise对象。 
 * 
 * 
 *  如果多次调用catch，建议使用try catch语句进行捕获
 * 
 */
p1.catch(()=>{
  console.log("女孩男朋友不同意");
  return new Promise(()=>{});
}).then(() => {
  console.log("女孩男朋友同意了");
  return fn();
}).catch(()=>{
  console.log("父亲没同意");
  return new Promise(()=>{});
}).then(() => {
  console.log("女孩的父亲同意了");
  return fn()
}).catch(()=>{
  console.log("母亲没同意");
  return new Promise(()=>{});
}).then(() => {
  console.log("女孩的母亲同意了");
})

*   Promise 三种状态：

      pending：初始值。标识进行中。

      fulfilled:操作成功 。

      rejected:操作失败。

 promise是一个对象，所以创建时需要使用new关键字。参数为一个回调函数，回调函数有两个形参：resolve，reject。这两个参数都是函数。

let p = new Promise((resolve,reject)=>{

  // resolve表示异步函数成功执行后的执行的操作

  // reject表示异步函数执行失败后的执行的操作

  // 将异步代码写在这里。
  setTimeout(function(){

    if (Math.random()>0.5) {

      // 操作成功了
      resolve()

    }else{

      // 操作失败了
      reject();

    }
  },1000)
})

  // Promise支持链式调用。
p.then(()=>{
  console.log("执行成功了");
}).catch(()=>{
  console.log("执行失败了");
})