Why is my foreach and map return undefined

Question

I have a packet system where you can have products in a packet.

So if anyone buy a packet I add this in shopping cart, if he buy it again then I check if the packet id is the same and if the products in packet have the same size and color if yes then I add amount + 1.

The problem is, I got undefined.

I console log all statements and its logging, I get the values in console log and the statements but he is returning undefined i dont know why...

        action.payload.packet?.products.forEach((product => {

         return state.cart.map((el => {
          if(el.packet?.id === action.payload.packet?.id) {
            return {
              ...el,
              product: el.packet?.products.map((state_p => {
                if(product.id === state_p.id) {
                  return {
                    ...state_p,
                    selectedOption: state_p.selectedOption.map((so => {
                      if(so.color === product.selectedOption[0].color && so.size === product.selectedOption[0].size) {
                        console.log('HII333')
                        return {
                          ...so,
                          amount: so.amount + 1
                        }
                      } else {
                        return {
                          ...so
                        }
                      }
                    }))
                  }
                } else {
                  return {
                    ...state_p
                  }
                }
              }))
            }
          } else {
            return {
              ...el
            }
          }
          }));
        }));

did I miss a return statement ?

Answer 1

ForEach method works in such way in which it doesn't return anything while it works. So even if you add return statement in your forEach, it wouldn't return anything. In your case you can change forEach to map method which returns new array