How can I add a new key with a value to an object in TypeScript?

Question

I have a function whose task is to count the price of a product after a discount. However as a result I get objects without this value (totalPrice). Where am I making mistake?

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

You are not modifying products in your array. You have two options:

• use products.forEach and pass in a function that modifies a product. Return modified products.
• use products.map and pass in a function that takes a product and creates new object with additional property, return the result of mapping.

I would argue that 2nd approach is more idiomatic in 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