Angular 7 - obiekt się nadpisuje mimo iż tworzę nowy

Witam.
Moja aplikacja ma opcję wyboru towaru z modalowego okienka. Po kliknięciu na checkbox wywołuję tę funkcję:

  multiSelectProduct(product: any) {
    const prod = product;
    prod.twr_Ilosc = 1;
    prod.twr_Wartosc = prod.twr_Cena * prod.twr_Ilosc;
    this.selectedProducts.push(prod);
  }

Mimo, iż tworze nowy obiekt prod to dane obiektu product się nadpisują. Na skrinach widać, że przed wybraniem ilość była 2 szt., a po wybraniu 1 szt., ponieważ to logiczne, że ktoś chce jedną sztukę na start, a nie cały stan magazynowy.
Dlaczego tak się dzieje i co mogę zrobić żeby się to nie nadpisywało?

Nie tworzysz nowego obiektu
https://stackoverflow.com/questions/728360/how-do-i-correctly-clone-a-javascript-object

W ten sposób przypisujesz obiekt razem z referencją, stąd później nadpisujesz też bazowy obiekt. Z tego co na szybko bym spróbował to tym "hackiem":

const prod= JSON.parse(JSON.stringify(product));

Jeszcze wiele nauki przede mną. Dzięki, działa elegancko

Musisz tez pamietac o tym jaka jest roznica pomiedzy shallow copy i deep clone czyli za pomoca:

JSON.parse(JSON.stringify(product));

Robisz deep clone czyli kopiujesz tez nested object (oczywiscie same value) za pomoca Object.assign lub

const newObj = { ...oldObj }

Robisz shallow copy czyli kopiujesz tylko object ale juz nested object bede zawsze referencja

W obiektach, na których pracuje nie ma nested objects, nie ma funkcji. Tylko property różnego typu z czego w tym przypadku nie wszystkie mi są potrzebne, ale tym się zajmę później.