角度6避免回叫地狱

考虑下列观测值:

const sourceA = httpClient.get(/*...*/);
const sourceB = httpClient.get(/*...*/);
const sourceC = httpClient.get(/*...*/);

httpClient 是Angular的 HTTPClient .

 const A = sourceA.pipe(
    switchMap(a => sourceB.pipe(
        map(b => {
            // do some operation using a and b.
            // Return both a and b in an array, but you can
            // also return them in an object if you wish.
            return [a,b]; 
        })
    )),
    switchMap(ab => sourceC.pipe(
        map(c => {
            // do some operations using a, b, and/or c.
            return a;
       }) 
    ))
);

现在你只需要订阅 A :

A.subscribe(a => console.log(a));

您可以阅读有关RxJs运算符的信息 here

因此,首先,我认为你的函数应该要求,作为它的唯一参数,一个 当一切都最终发生时,它将被调用。

至于“如何处理步骤1、2和3 ... 我马上想到的是 算法。

假设您的函数调用导致一个新的“请求”被放置在某个请求表队列上,并且,如果必要的话,一个计时器请求(设置为在1毫秒内关闭)为该队列提供服务(除其他外,这个条目将包含对回调的引用。)我们还假设请求被赋予一个随机字符串“nonce”,该字符串将用于唯一地标识它:它将被传递给各种外部请求,并且必须包含在它们相应的回复中。

FSM公司 我们的想法是请求将有一个 (属性),例如: DOWNLOADING_FROM_B , B_DOWNLOADS_COMPLETE DOWNLOADING_FROM_C , C_REQUESTS_COMPLETE (1) 能够通过其nonce来定位请求条目,然后 (2) 明确地“知道下一步要做什么”和“要分配什么新的状态(如果有的话)”,仅仅基于对条目属性的检查 state .

例如,当国家达到

(什么国家可以导致什么国家,以及当他们这样做时该做什么), 不管您是否真的创建了一个数据结构来表示所谓的“状态表”,尽管有时它甚至更优雅(!)当你这么做的时候(可能会将混乱的决策逻辑推送到简单的表查找中。)

当然,这是一个经典的算法,适用于并且已经在“阳光下的每一种编程语言”中使用过(很多硬件设备也使用它)