ES6异步处理解决方案

ES6的异步处理模型分为俩个阶段三种状态。

两个阶段：未决unsettled, 已决settled。

三种状态：pending挂起状态 , resolved成功， rejected失败

通常把从未决推向已决的resolved状态的过程叫做resolve 从未决推向已决的reject状态 rejected状态过程叫做reject

任务已决状态后可能需要后续处理，若任务成功了 resolved 有后续处理 如果任务失败了 rejected 仍有后续处理 把针对resolved的后续处理 被称为thenable 针对rejected的后续处理 被称为catchable 针对resolved的后续处理被称为thenable 针对rejected的后续处理被称为catchable

Promise对象promise 简单就是一个容器 里面保存着某个未来才会结束事件(一般就是一个异步请求)的结果

从语法上说 promise是一个对象 从它可以获取异步操作的消息 promise提供的API 各种异步操作都可以用同样的方法进行处理。

promise对象有两个以下特点

1 对象的状态不受外界影响 promise对象代表一个异步操作 有三种状态

pending(进行中) resolved(已完成) rejected(以失败)

2 一旦状态改变 就不会在变 任何时候都可以得到这个结果 promise对象的状态改变 只有两种可能 从pending变为resolved和pending变为rejected 只要这两种情况发生 状态就凝固了 不会在变了 会一直保持这个结果

有了promise对象 就可以将异步操作以同步操作的流程表达出来 避免回调地狱 promise对象提供统一的接口 使得控制异步操作更加容易

promise缺点

1 无法取消 一旦新建它就会立即执行 无法中途取消  2 不设置回调函数 promise内部抛出的错误 不会反应到外部 3 当处于pending状态时 无法得知目前进展到哪一个阶段 刚刚开始 还是即将结束

promise用法

ES6规定 promise对象是一个构造函数 用来生成promise实例 promise构造函数接受一个函数作为参数 该函数的两个参数分别是resolve 和 reject

const operation = new Promise((resolve,reject) => {  // 任务未决阶段代码  //立即执行  console.log('开始');  setTimeout(() => {    if( Math.random() > 0.5) {      resolve('成功');    } else {      reject('失败');    }  },1000)});operation.then((result) => {   console.log('成功') },(error) => {   console.log('失败')});

resolve函数的作是 将promise对象的状态从 未完成 变为成功(即从pending变为resolved) 在异步操作成功时调用，并将异步操作的结果 作为参数传递出去 reject函数的作用是 将promise对象的状态 从未完成 变为 失败 (即从pending变为reject) 在异步操作失败时调用 并将异步操作报出的错误 作为参数传递出去

Promise.prototype.then()

then是定义原型对象promise.prototype上的 then方法第一个参数是resolved状态的回调函数 第二个参数是rejected状态的回调函数，then方法返回的是一个新的promise实例(不是原来的promise实例) 可以采用链式写法,即then后面再调用另一个then方法。

// then方法operation.then((result) => {  console.log('正常输出')}).then(() => {  //......})

Promise.prototype.catch()

如果异步操作抛出错误 状态就会变为rejected 就会调用catch()方法指定的回调函数 处理这个错误 另外 then()方法指定的回调函数 如果运行中抛出错误 也会被catch()方法捕获 catch()返回的是一个promise对象

// 捕获错误catchoperation.then((result) => {  console.log('正常打印')}).catch((error) => {  console.log('我捕获到了',error)});

Promise.prototype.finally()

finally()方法用于指定promise对象最后状态如何 都会执行的操作 finally方法里面的操作 好像是与状态无关的 不依赖于promise的执行结果

// finallyoperation.then((result) => {  console.log('正常打印')}).catch((error) => {  console.log('我捕获到了',error)}).finally((run) => {  console.log('我一直都是执行')})

错误处理 try/catch/finally语句用于处理代码中可能出现的错误信息 try语句允许我们定义在执行时进行错误测试的代码块 catch语句允许我们定义当try代码块进行错误测试的代码块 finally语句在try和catch之后无论有没有异常都会执行

原文：https://juejin.cn/post/7103783934814584840