将回调地狱转换为可观察链

时间:2016-09-23 17:05:51

标签: rxjs angular2-observables

我一直在使用一个约定,其中我的函数返回observables,以实现强制顺序的一系列函数调用,每个函数调用都将返回值传递给它们后面的“回调”函数。但在阅读和观看教程之后,似乎我可以用我认为的flatmap更好地做到这一点。我认为我接近这个建议https://stackoverflow.com/a/34701912/2621091虽然我没有开始承诺。下面我列出了一些示例,希望能帮助我们提供更好的方法。我非常感谢您提供的帮助:

grandparentFunction().subscribe(grandparentreturnobj => {

    ... oprate upon grandparentreturnobj ...

});


grandparentFunction() {

    let _self = this;

    return Observable.create((observer) => {

        ...

        _self.parentFunction().subscribe(parentreturnobj => {

            ... 

            _self.childFunction( parentreturnobj ).subscribe(childreturnobj => {

                ... 

                observer.next( grandparentreturnobj );
                observer.complete(); 
            });
        });
    });
}


parentFunction() {

    let _self = this;

    return Observable.create((observer) => {

        ...

        observer.next( parentreturnobj );
        observer.complete(); 
    }
}


childFunction() {

    let _self = this;

    return Observable.create((observer) => {

        ...

        observer.next( childreturnobj );
        observer.complete(); 
    }
}

1 个答案:

答案 0 :(得分:1)

RxJS的一般经验法则是,您应该尽量避免创建手工制作的自定义Observable(即使用Observable.create()),除非您知道自己在做什么,并且可以& #39;避免它。如果你没有牢牢掌握RxJS合约,有一些棘手的语义很容易引起微妙的问题,所以尝试使用现有的Observable创建通常会更好功能。更好的是,通过在现有的Observable上应用运算符来创建Observable,并返回它。

就您对示例代码的具体批评而言,您应该使用.flatMap()来创建Observable函数链。您目前拥有的嵌套Observable.create()并不像Rx一样,并且遇到了相同的问题&#callback hell'-style代码。

这是一个做你的例子做同样事情的例子,但是用更惯用的Rx风格。 doStuff()是我们想要创建的异步函数。 doStuff()需要调用异步函数step1(),将其结果链接到异步函数step2(),然后对结果执行一些进一步的操作,并将最终结果返回到doStuff()的来电者。

function doStuff(thingToMake) {
    return step1(thingToMake)
        .flatMap((step1Result) => step2(step1Result))
        .map((step2Result) => {
            let doStuffResult = `${step2Result}, and then we're done`;
            // ...
            return doStuffResult;
        });
}

function step1(thingToMake) {
    let result = `To make a ${thingToMake}, first we do step 1`;
    // ...
    return Rx.Observable.of(result);
}

function step2(prevSteps) {
    let result = `${prevSteps}, then we do step 2`
    // ...
    return Rx.Observable.of(result);
}

doStuff('chain').subscribe(
    (doStuffResult) => console.log(`Here's how you make a chain: ${doStuffResult}`),
    (err) => console.error(`Oh no, doStuff failed!`, err),
    () => console.debug(`doStuff is done making stuff`)
)

Rx.Observable.of(x)是现有Observable创建函数的示例。它只是创建一个返回x的Observable,然后完成。