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

Question

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

来实现 "Method Chaining"

我的问题是我必须创建一个使用回调 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()

我尝试将我的代码更改为 return 与 "Then" 的承诺，如下所示

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

  return readOrderPromise
};

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

TypeError: Cannot read property 'createOrder' of undefined

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

如何使用本机承诺和方法链接，使 "createOrder" 等待承诺解决？

Answer 1

得到类似的东西：

newCook.readOrder().createOrder()

如果每个方法仍然 return 是原始对象（用于常规链接），那么您可以像 jQuery 那样为动画做一些事情。它允许这样的事情：

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

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

它的工作方式是创建一组可以以这种方式在链中使用的方法，它们都通过队列工作。对象本身维护一个队列，每个希望参与此自动排序的方法都必须将自身及其参数排队，而不是直接执行。您可以使用 promises 监控所有操作，在这种情况下，队列可以只是一个实际的 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、基于回调的对象了解更多，我可能会 "promisify" 以某种自动化方式首先使用该对象，这样我就可以调用 promisified 方法它直接而不是在每个 NewCook 方法中重复 promisfy 代码。

例如，如果 Cook 回调都遵循 node.js 调用约定，则可以使用 Bluebird 的 PromisifyAll 方法自动承诺它们。如果它们都遵循其他一些调用约定，我可能会为该样式编写一个通用的 promisify 方法，而不是手动 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);

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

How to do Method Chaining in ProtoType with Promises around callbacks

javascript

callback

method-chaining

es6-promise

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

How to do Method Chaining in ProtoType with Promises *around* callbacks

javascript

callback

method-chaining

es6-promise

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

How to do Method Chaining in ProtoType with Promises around callbacks