javascript - 如何向 TypeScript 中的对象添加具有值的新键？

Question

我有一个函数，其任务是计算打折后的产品价格。但是结果我得到了没有这个值(totalPrice)的对象。我哪里出错了？

const arrayObj = [
    {
        basePrice: 12,
        discount: 3,
    },
    {
        basePrice: 12,
        discount: 2,
    },
    {
        basePrice: 8,
        discount: 2,
    },
];

interface Product {
    basePrice: number;
    discount: number;
    totalPrice?: number;
}
const countTotalPrice = (products: Product[]): Product[] => {
    const calculateTotalPrice = (
        basePrice: number,
        discount: number,
        totalPrice?: number
    ): void => {
    
        totalPrice = basePrice - discount;
    };

    products.forEach((product) =>
        calculateTotalPrice(
            product.basePrice,
            product.discount,
            product.totalPrice
        )
    );
    return products;
};
console.log(countTotalPrice(arrayObj));

Answer 1

您没有修改数组中的产品。您有两个选择:

• 使用products.forEach 并传入一个修改产品的函数。退回修改后的产品。
• 使用 products.map 并传入一个函数，该函数接受一个产品并创建具有附加属性的新对象，返回映射结果。

我认为第二种方法在 JS/TS 中更为惯用。

const countTotalPrice = (products: Product[]): Product[] => {
  return products.map((product) => 
    ({    // the parentheses are necessary in this position
          // we want object literal, not code block
          ...product,
          totalPrice: product.basePrice - product.discount
    })
  );
}

Playground link