获取数据后转换数据的正确方法

Question

我从端点获取国家/地区，但为了以所需形式显示数据，我使用 RxJS 地图运算符对其进行转换，其中我使用 [=11= 计算产品数组的长度和总费用] 方法。这段代码工作得很好，但问题是我不知道这是否是进行转换的正确方法。所以总结一下我的困惑，我有以下问题：

getCountries(): Observable<Country[]> {
return this.http.get<responseCountry[]>(this.countriesUrl).pipe(
  map((countries: responseCountry[]) =>
    countries.map((country: responseCountry): Country => {

      const transformedCountryData: Country = {
        name: country.name,
        quantity_of_products: country.products.length,
        totalExpense: this.calculateTotalExpenses(
          country.products
        ),
      };
      return transformedCountryData;
    })
  )
);
}

calculateTotalExpenses(products: Product[]): number {
const initialValue = 0;

const totalExpense: number = products.reduce(
  (previousValue, currentValue) => {
    return (
      previousValue +
      currentValue.price * currentValue.quantity_for_month
    );
  },
  initialValue
);

return totalExpense;
}

也许这是创建和使用 Country Class 而不是 interface 的更好方法，因为我会同时使用它进行类型检查，而且我可以移动calculateTotalExpenses() 方法到 class 并且转换将在 class 而不是服务内部进行。我对么？有没有更好的解决办法？
准备好，这里我暴露了我的深厚知识差距:)当我像我一样转换数据时，如果使用.reduce()的calculateTotalExpenses()方法给我结果怎么办稍后（可能是因为很多产品），它不会导致 totalExpense 属性变成 undefined 什么的吗？
也许我应该在后端进行这种转换并提供现成的属性？在前端做这种数据转换是不好的做法吗？

Answer 1

让我们从您的 3 点开始：

This is the best practice to follow, we should always avoid such calculations in front end. Your back end API should return you the transformed data

2分：

No, this will never happen unless there is null/undefined in data itself or some calculation mistake. You are returning an Observable and you will use subscribe or async pipe to consume it. Whenever the subscription will happen, the pipe operator will take care of it.

3分：

As per my knowledge, it's better to use interface.

获取数据后转换数据的正确方法

Right way to transform data after fetching it

rxjs

typescript

angular-services

angular