JavaScript异步编程：（三）Promise链式

前言

Promise的实例方法（then、catch、finally）返回的都是一个新的Promise对象，所以可以通过链式的方式，顺序执行几个异步方法；

一般使用

taskOne() {
  return new Promise((resolve) => {
    setInterval(() => {
      resolve(1);
    }, 1000)
  });
},

taskTwo() {
  return new Promise((resolve) => {
    setInterval(() => {
      resolve(2);
    }, 2000)
  });
},

taskThree() {
  return new Promise((resolve) => {
    setInterval(() => {
      resolve(3);
    }, 3000)
  });
},

// 链式调用
this.taskOne().then((value) => {
  console.log(value, 'taskOne')
  return this.taskTwo()
}).then((value) => {
  console.log(value, 'taskTow')
  return this.taskThree()
}).then((value) => {
  console.log(value, 'taskThree');
}).catch((value) => {
  console.log(value, 'error')
})

一、then与catch

then的第二个参数失败后的回调函数，而catch也是失败后的回调函数；

promise.then(null, (value) => {
  console.log(value, "reject");
});

等价于

promise.catch((value) => {
  console.log(value, 'reject');
})

Promise 对象的错误具有“冒泡”性质，会一直向后传递，直到被捕获为止。也就是说，错误总是会被下一个catch语句捕获。 所以通常建议使用catch 方法去捕获异常，而不要用 then(null, function(error) {}) 的方式，因为这样只能捕获当前 Promise 的异常。

二、值的传递

1. 异步编程

在then内部，创建一个新的Promise，可以使用resolve传递参数，则在下一个then，可以获取到传递的参数值；

2.同步

this.taskOne().then((value) => {
  console.log(value, 'taskOne')
  return value + 2;
}).then((value) => {
  console.log(value, 'taskTwo');
})

在then内部，直接使用return返回值，则在下一个then，可以获取到传递的参数值；