Kapselung von Geschäftslogik im React-State mit unveränderlichen Domain-Entitätsklassen

import React, { useState } from 'react';
 
class Money {
  constructor(cents, currency = 'EUR') {
    this.cents = Math.round(cents);
    this.currency = currency;
    Object.freeze(this);
  }
 
  add(other) {
    if (this.currency !== other.currency) {
      throw new Error('Currency mismatch');
    }
    return new Money(this.cents + other.cents, this.currency);
  }
 
  format() {
    return new Intl.NumberFormat('de-DE', {
      style: 'currency',
      currency: this.currency
    }).format(this.cents / 100);
  }
}
 
export function BudgetTracker() {
  const [total, setTotal] = useState(() => new Money(1000));
 
  const handleDeposit = () => {
    setTotal((prev) => prev.add(new Money(500)));
  };
 
  return (
    <div>
      <h2>Current Balance: {total.format()}</h2>
      <button onClick={handleDeposit}>Deposit 5,00 €</button>
    </div>
  );
}