如何重用代碼並使其更靈活？

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關鍵字的更多信息。