how to sum an amount product to initial productarray localstorage?

Question

i'm following a course to learn javascript, but i got stuck somewhere !

I've created a custom sofa shop, with 3 pages for the moment : welcome page with all products, a custom page for each product, and a cart page.

I stock the cart products in the localstorage.

But I got a problem.

In the product page, we already have the option to choose what amount of the same article we want to add into the cart page. If the cart page, and the productarray in localstorage are empty, when we are adding an certain amount of a product, it will simply take the value of the input, and send to the local storage.

But, if i already have, for example, "blue sofa" x30 in my cart, and i return to the product page, and i send 40x "blue sofa" in the localstorage, instead of sum the already existing amount of "blue sofa" + what i just sent, it just update the amount, so delete the initial 30x "blue sofa" and replace it with 40x "blue sofa".

How can i fix it ? Thx in advance !

if (productArray == null) {
        productArray = [];
        productArray.push(fusionproductAndColor);
        productArray.amount += amountInput.value;
        localStorage.setItem("product", JSON.stringify(productArray));
    } else if (productArray != null) {
        for (i = 0; i < productArray.length; i++){
            console.log("test");
            if (productArray[i]._id == productDetails._id && productArray[i].color == select.value) {
                return (
                    productArray[i].amount = amountInput.value,
                    productArray.amount = this.amount += amountInput.value, 
                    console.log("quantite"),
                    localStorage.setItem("product",JSON.stringify(productArray))
                    (productArray = JSON.parse(localStorage.getItem("product")))
                );
            }
        }
        for (i = 0; i < productArray.length; i++) {
            if (productArray[i]._id == productDetails._id && productArray[i].color != productDetails.color){
                return (
                    productArray.push(fusionproductAndColor),
                    localStorage.setItem("product",JSON.stringify(productArray))
                    (productArray = JSON.parse(localStorage.getItem("product")))
                );
            }
        }
        for (i = 0; i < productArray.length; i++) {
            if (productArray[i]._id != productDetails._id){
                return (
                    productArray.push(fusionproductAndColor),
                    localStorage.setItem("product",JSON.stringify(productArray))
                    (productArray = JSON.parse(localStorage.getItem("product")))
                );

first screenshot

second screenshot

code update screenshot 02/03/2022

last update

Answer 1

let myObject = {
  amount:2
}

let myArray = [];

myArray.push(myObject);

console.log("value of myArray.amount:", myArray.amount);
console.log("value of myArray[0].amount:", myArray[0].amount);

In your first if block, try: productArray[0].amount += amountInput.value;

instead of: productArray.amount += amountInput.value;

(arrays do not have a property called amount but an object you just stored in element 0 of the new array could have).

I would have expected this to throw an error, visible on the developer console in your browser.