携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第24天 点击查看活动详情

前言

之前的文章中每一个我提到的ES6新的特性都是我非常想继续深入去了解的，今天来了解一下ES6一个特别抽象的概念Promise，当我不了解Primise，听到Promise这个词的时候我就觉得它是一个非常复杂的东西，所以先探索一下简单的新特性，然后今天我就把它放在后面，今天稍微揭开它神秘的面纱。

经常会听到前端面试的时候会问到这个知识点，什么手写Promise，Promise几种状态，感觉难以理解，我想我也不是搞前端的就了解其中的基础概念就行了吧，虽然平常也用不到它，但是好多的技术原理都会用到它，所以还是尽量知道它的一些基本概念和特性吧。

什么是Promise

Promise是一种异步编程的一种方案，Promise是一个复杂的对象，代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。

特性

Promise 对象有几个特性需要注意，跟我之前的的异步爬虫scrapy 是不一样的情况，传统的异步会有回调函数和事件驱动，Promise是有微任务的概念去循环来替换这个事件驱动的,这里要去深入了解一下node.js的事件循环。

• 无法取消Promise，一旦新建它就会立即执行，无法中途取消，所以状态只会从pending到resolved或者pending=到rejected。

• 如果不设置回调函数，Promise内部抛出的错误，不会把错误抛到对象外部。（感觉面试会经常问到这）

从代码了解

在日常的代码中用到Primise 最常用的就是axios了，axios 是由 promise封装的一个 http 的库，看下我之前下载excel请求的代码：

...
    downloadExcel() {
      this.loading = true
      console.log(this.form_data)
      downloadExcel(this.form_data).then(res => {
        this.$message({
          type: 'success',
          message: '下载完成'
        })
      }).finally(() => {
        this.loading = false
      })
    },
    ...

.then(...) 其中执行的message就是异步的，我使用了 this.loading这个变量绑定了一个按钮是否能点击的状态，如果放在.then里面想请求结束过后展示下载完成的弹窗，但是它没有生效，最后放在finally()这个方法里才会生效，不管promise最后的状态，在执行完then或catch指定的回调函数以后，都会执行finally方法指定的回调函数，所以必定会执行这个函数。

总结

上面的代码用同步形式的代码写出了异步调用的HTTP请求，需要再仔细补充一下其中的逻辑，开始请求Promise就是初始化，传入的函数是同步执行的（此时就是发起请求），然后注册 then 回调（注册展示成功的提示）。注册完之后，继续往下执行同步代码（等待HTTP返回），在这之前，then 中回调不会执行。同步代码块执行完毕后，才会在事件循环中检测是否有可用的 promise 回调，如果有（此时就是可能有结果），那么执行（then的内容），如果没有，继续下一个事件循环。

好了，今天Promise就了解到这里，后面再用到它的时候再去仔细研究。