链接异步方法调用 - javascript [英] chaining async method calls - javascript

问题描述

您有一个原型对象 Foo，其中包含两个异步方法调用 bar 和 baz.

You have a prototype object Foo with two async method calls, bar and baz.

var bob = new Foo()

Foo.prototype.bar = function land(callback) {
  setTimeout(function() {
    callback()
    console.log('bar');
  }, 3000);
};

Foo.prototype.baz = function land(callback) {
  setTimeout(function() {
    callback()
    console.log('baz');
  }, 3000);
};

我们想要做 bob.bar().baz() 并让它依次记录bar"和baz".

We want to do bob.bar().baz() and have it log "bar" and "baz" sequentially.

如果您不能修改方法调用(包括传入您的回调函数)，您如何将默认回调传递到这些方法调用中?

If you cannot modify the method calls (including passing in your callback function), how can you pass a default callback into these method calls?

一些想法:

1. 用装饰器包裹bob"(对如何实现仍然模糊，可以举个小例子)

1. Wrap "bob" with decorator (still fuzzy on how to implement, could use a small example)

修改构造函数以在未分配时分配默认回调(尚未考虑是否可能)

Modify constructor to assign default callback if none assigned (have not considered if this is possible or not)

使用一个生成器包装器，它会继续调用 next 方法，直到没有剩下的方法为止?

Use a generator wrapper that will continue to call next method until none are left?

推荐答案

更推荐的方式是使用 promises 因为这是执行异步工作的社区范围的做法.

The more recommended way instead is to use promises as this is the community-wide practice to do async work.

我们想要做 bob.bar().baz() 并让它记录bar"和巴兹"顺序.

We want to do bob.bar().baz() and have it log "bar" and "baz" sequentially.

你为什么要这样做只是为了实现这个bob.bar().baz()语法"?您可以使用 Promise API 非常巧妙地完成这项工作，而无需额外的努力来使该语法起作用，这确实增加了代码复杂性，从而降低了实际可读性.

Why would you want to do that just to achieve this bob.bar().baz() "syntax"? You could do it pretty neatly using the Promise API w/o additional efforts to make that syntax work that indeed increases code complexity reducing the actual readability.

因此，您可能需要考虑使用这种基于 Promise 的方法.它提供了比您的方法所能达到的更大的灵活性:

So, you might want to consider using the promise-based approach like this. It offers much flexibility than what you would have achieved with your approach:

Foo.prototype.bar = function () {
    return new Promise(function (resolve) {
        setTimeout(function () {
            resolve()
            console.log('bar');
        }, 3000);
    };
};

Foo.prototype.baz = function () {
    return new Promise(function (resolve) {
        setTimeout(function () {
            resolve()
            console.log('baz');
        }, 3000);
    };
};

现在您可以这样做以顺序一个接一个地运行它们:

Now you'd do this to run them sequentially one after another:

var bob = new Foo();

bob.bar().then(function() {
   return bob.baz();
});

// If you're using ES2015+ you could even do:
bob.bar().then(() => bob.baz());

如果你需要链接更多的函数，你可以简单地做:

If you need to chain more functions you could simply do it:

bob.bar()
    .then(() => bob.baz())
    .then(() => bob.anotherBaz())
    .then(() => bob.somethingElse());  

无论如何，如果您不习惯使用 Promise，您可能需要阅读本文

Anyway, if you're not used to using promises you might want to read this

这篇关于链接异步方法调用 - javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！