如何重用代码并使其更灵活？

Question

我有以下代码：

combineLatest(...this.filtersList.map((f) => f.filtersChanges)).subscribe(
            (selectedFilters: Filter[]) => {
                const filterUrlCombiner = new FilterUrlCombiner();
                const filterUrlBuilders = selectedFilters
                    .filter(Boolean)
                    .map((filter) => new FilterUrlBuilder(filter, ComparingOperation.eq));
                const filterUrls = filterUrlBuilders.map((filter) => filter.buildStringUrl()).filter(Boolean);

                this.filterBy = filterUrlCombiner.combineUrl(filterUrls);
                this.settingsService.setExecutionFiltersSettings(selectedFilters);
            },
            (error) => {
                console.log('ERROR: ' + error);
            },
        );

此代码侦听来自过滤器filtersChanges的更改，并将它们的最新值作为数组返回。

然后数组由FilterUrlCombiner和FilterUrlBuilder处理，作为完成结果，我在this.filterBy中得到字符串 URL，其中包含数组中的所有参数。

我需要在另一个地方重用subscribe()中包含的代码，但我不想复制/过去。 如何重用代码并使其更灵活？

Answer 1

您实际上是将回调函数传递给订阅的next和error参数。 您可以单独定义回调并从订阅中调用它们。

combineLatest(...this.filtersList.map((f) => f.filtersChanges)).subscribe(
    this.onNext.bind(this),
    this.onError.bind(this)
);

onNext(selectedFilters: Filter[]) {
    const filterUrlCombiner = new FilterUrlCombiner();
    const filterUrlBuilders = selectedFilters
        .filter(Boolean)
        .map((filter) => new FilterUrlBuilder(filter, ComparingOperation.eq));
    const filterUrls = filterUrlBuilders.map((filter) => filter.buildStringUrl()).filter(Boolean);

    this.filterBy = filterUrlCombiner.combineUrl(filterUrls);
    this.settingsService.setExecutionFiltersSettings(selectedFilters);
}

onError(error: any) {
    console.log('ERROR: ' + error);
}

您需要使用bind() function 来传递this关键字的含义来指向class 成员变量。 有关如何this关键字的更多信息。