如何使用 Promise *around* 回调在 ProtoType 中进行方法链接

Question

我正在尝试使用本教程 (https://schier.co/blog/2013/11/14/method-chaining-in-javascript.html) 实现“方法链”

我的问题是我必须创建一个使用如下回调 API 的对象

function Cook() {};

Cook.prototype.readOrder = function readOrder(callback) {
  setTimeout(function() {
    callback()
    console.log('Cook has read the order');
 }, 666);
};
Cook.prototype.createOrder = function createOrder(callback) {
  setTimeout(function() {
    callback()
    console.log('Cook has created the order');
  }, 1337);
};

我希望能够在不更改上面代码的情况下进行方法链接...

我的方法是创建一个新的 Cook 并将回调包装在 Promises 中。

类似的东西。

function NewCook(cook){
  self = this;
  this.readOrder = function() {
      var readOrderPromise = new Promise(function(resolve, reject) {
        cook.readOrder(resolve)
      })
      return self
    };

  this.createOrder = function() {
      var createOrder = new Promise(function(resolve, reject) {
        cook.createOrder(resolve)
      })
      return self
    };
};


var original = new Cook();
var newCook = new newCook(cook)

但是，当我将我的方法链接在一起时，第二种方法不会等待第一种方法解决。

  newCook.readOrder().createOrder()

我尝试更改我的代码以返回带有“Then”的承诺，如下所示

this.readOrder = function() {
  var readOrderPromise = new Promise(function(resolve, reject) {
    cook.readOrder(resolve)
  }).then(function(){return self})

  return readOrderPromise
};

但是，使用此代码时，我收到一条错误消息

TypeError：无法读取未定义的属性“createOrder”

这让我觉得“createOrder”方法在触发之前没有等待“readOrder”解决......

如何使用 Native Promises 和 Method Chaining 让“createOrder”等待 Promise 解决？

Answer 1

得到类似的东西：

newCook.readOrder().createOrder()

如果每个方法仍然返回原始对象（用于常规链接），那么您可以执行 jQuery 为动画所做的事情。它允许：

$("someSelector").slideDown(500).fade(500);

.fade(500) 操作直到 .slideDown(500) 操作完成后才开始执行。两者都是异步的（因此函数会立即返回）。

它的工作方式是创建一组可以以这种方式在链中使用的方法，并且它们都通过队列工作。对象本身维护一个队列，并且希望参与此自动排序的每个方法都必须将自身及其参数排队，而不是直接执行。您可以使用 Promise 监控您的所有操作，在这种情况下，队列可以只是一个实际的 Promise 链。因此，每个新操作都只是将自己添加到 Promise 链的末尾。

这是一个使用 ES6 语法的示例：

class Queue {
    constructor() {
        this.init();
    }
    init() {
        let oldP = this.p;
        this.p = Promise.resolve();
        return oldP;
    }
    promise() {
        return this.p;
    }
    // takes a function that returns a promise
    add(fn, ...args) {
        // add this operation into our current promise chain
        this.p = this.p.then(() => {
            return fn.call(...args);
        });
    }
}

class NewCook {
    constructor(cook) {
        this.cook = cook;
        this.q = new Queue();
    }
    // get current promise chain
    promise() {
        return this.q.promise();
    }
    // starts new promise chain, returns prior one
    // this branches a new promise chain so new operations
    // are not affected by the prior state of the promise chain
    // Note that rejects are "latched" so this is required if the previous
    // promise chain rejected.
    init() {
        return this.q.init();
    }
    readOrder() {
        this.q.add(() => {
            return new Promise((resolve, reject) => {
                this.cook.readOrder(resolve);
            });
        });
        return this;
    }
    createOrder(data) {
        this.q.add(() => {
            return new Promise((resolve, reject) => {
                this.cook.createOrder(data, resolve);
            });
        });
        return this;
    }
}

var cook = new Cook();
var newCook = new NewCook(cook);

---

在现实生活中，我对现有的基于回调的 Cook 有更多了解，我可能会首先以某种自动化方式“承诺”该对象，因此我可以直接在其上调用承诺的方法，而不是重复在每个NewCook 方法中承诺代码。

例如，如果 Cook 回调都遵循 node.js 调用约定，那么可以使用 Bluebird 的 PromisifyAll 方法自动对它们进行承诺。如果它们都遵循其他一些调用约定，我可能会为该样式编写一个通用的 promisify 方法，可以使用该方法，而不是手动承诺您要使用的每个方法。

// promisify the Cook methods using Bluebird
Promise.promisifyAll(Cook);

class NewCook {
    constructor(cook) {
        this.cook = cook;
        this.q = new Queue();
    }
    // get current promise chain
    promise() {
        return this.q.promise();
    }
    // starts new promise chain, returns prior one
    init() {
        return this.q.init();
    }
    readOrder() {
        this.q.add(this.cook.readOrderAsync.bind(this.cook));
        return this;
    }
    createOrder(data) {
        this.q.add(this.cook.createOrderAsync.bind(this.cook), data);
        return this;
    }
}

var cook = new Cook();
var newCook = new newCook(cook);