Promise 篇 - 一言既出 驷马难追

楔子

夫子之说君子也，驷不及舌
--出自《论语·颜渊》

一言而非，驷马不能追；一言而急，驷马不能及
--出自《邓析子·转辞》

君子的所为 —— Promise

一言既出驷马难追，古代人对君子的追求，造就了他们对承诺的认真和执着，而做为程序员的咱们，虽不能读万卷书，却依然能从 Promise 里感觉到那份执着与纯真。

Promise的世界观

和咱们小时候相似，Promise 从小便被教育这个世界是非黑即白。坏人就是绝对的坏人，好人就是绝对的好人，当 Promise 处于少年期 ( Pending ) 时期时，就一直在考虑未来长大了会怎么样，诚然，全部的 Promise 都想着当大侠 ( 变成 Fulfilled 状态 )，惋惜并非全部的 Promise 最终都能变成大侠 ( Fulfilled ) 状态，有不少 Promise 会由于种种不肯定的缘由变成 Rejected 状态，还有一部分可能终其一辈子都在少年期 ( Pending ) 徘徊。

Promise的用处

刚开始接触 Promise，可能感受不到他的明显的用处，可是最近项目的一次实践，使我真正感觉到了他的威力。

// 右键弹窗出现后等待用户点击重命名，故此处新建一个promise
      new Promise(resolve => {
        this.reNameResolve = resolve
      }).then(() => {
        data.isEdit = true
        this.$nextTick(() => {
          this.$refs.input.focus()
        })
        // 等待用户再次点击右键，在没有enter以前
        return new Promise(resolve => {
          this.preReNameResolve = resolve
        }).then(() => {
           data.isEdit = false
        })
      })
复制代码

这是一个右键弹窗功能函数的一部分

单纯的一个右键，功能其实很简单，就是将这个弹窗组件显示便可，可是为何要执行这个 Promise 呢？咱们来分析一下弹窗的后续操做，当弹窗出现后，咱们势必要去点击这个重命名，那么问题就来了，重命名也要有重命名的对象，咱们到底要给谁重命名呢？因而咱们会看到，这个 Promise 其实就是在弹窗的时候将传过来的参数进行了缓存，这样，当咱们点击重命名的时候，就能够将最外层的 Promise 的状态改变，变为 Fulfilled，同时咱们在将其变成 Fullfilled 以后，又会新建一个 Promsie，这个 Promsie 的做用是再次把对应的该条数据的 isEdit 属性变回到 false 状态，这个 resolve 会在下面这个右键弹窗函数里判断后执行

// 右键重命名
    rename() {
      if (this.preReNameResolve) {
        this.preReNameResolve()
      }
      this.reNameResolve()
      this.contextmenuFlag = false
    }
复制代码

看到这里，想必你们应该清楚了 Promise 的妙处了，最后也但愿咱们你们都能像 Promise 同样——单纯、执着，信守承诺。