深度解读thenable

在学习promise时，我们经常会遇到thenable一词。关于thenable，目前的资料解读不够通俗易懂，又或者脉络不够清晰，本文主要对thenable进行详细剖析，以便各位参考。笔者希望你能够仅凭这一篇文章，便能深度掌握该知识点。

thenable是什么

thenable 是指任何拥有then(..)方法的对象或函数。

如下：

var o = { then: function(){} }; // o是thenable对象

var f = function(){};
f.then = function(){}; // f是thenable函数

关于对象，我们比较容易理解。这里单独提到拥有thenable方法的函数，原因何在呢？

原因在于判断是不是thenable时，一般使用typeof检测即可，typeof本身对于引用类型的检测除了函数都会返回"object"，但我们不能排除函数。这个定义实际上与typeof类型检测相对应的。

thenable解决什么问题

主要是兼容历史性实现。

在 Promise 成为 JavaScript 语言的一部分之前，JavaScript 生态系统已经有了多种 Promise 实现。尽管它们在内部的表示方式不同，但至少所有类 Promise 的对象都实现了 Thenable 接口。这就使得同化一个非纯种但相似Promise的值是必要的，否则会导致其他实现不可用。

如何判断thenable

根据上面的定义，thenable的鸭子类型检查应从两方面着手：

其一：应是对象或者函数；

其二：应具有then方法。

综上，可用如下代码进行检查：

if (
    p !== null &&
    (
        typeof p === "object" ||
        typeof p === "function"
    ) &&
    typeof p.then === "function"
) {
    // 认为它是一个thenable!
}
else {
    // 不是一个thenable
}

如何区分thenable对象和promise对象

Promise 本身也是 thenable 对象，那么如何区分真正的promise对象呢？

显然，真正的promise对象是ES6 Promise构造函数的实例，而一般thenable对象则不是，故可用instanceof 判断,如下：

function isES6promise( p ) {  
   return p instanceof Promise;
}

Promise.resolve如何解析thenable对象

Promise.resolve(value) 的 value 是个 thenable 对象时，返回的promise会“跟随”这个thenable的对象，采用它的最终状态。如下：

const aThenable = {
  then(onFulfilled, onRejected) {
    onFulfilled({
      // thenable 对象被兑现为另一个 thenable 对象
      then(onFulfilled, onRejected) {
        onFulfilled(42);
      },
    });
  },
};

Promise.resolve(aThenable); // 一个兑现值为 42 的 Promise

以上代码实际上是两层thenable对象：

其一，aThenable是一个thenable对象；

其二：aThenable的then方法中， onFulfilled的参数是一个thenable对象。

即，可以对以上代码进行如下变形：

const aThenable = {
  then:function (onFulfilled, onRejected) {
    onFulfilled({
      // thenable 对象被兑现为另一个 thenable 对象
      then:function(onFulfilled, onRejected) {
        onFulfilled(42);
      },
    });
  },
};

Promise.resolve(aThenable); // 一个兑现值为 42 的 Promise

每一次调用onFulfilled解析thenable对象时，都是将thenable对象的then函数的onFulfilled的值向外传递。