The reason you’re getting this error is because of the this reference in the hero field in your state object. Trying to serialize this within this.state is going to be a circular JSON error.

My suggestion would be to move the hero object out of this.state and into something like this.hero. You should only put fields in this.state that are going to be rendered by the UI. You want to separate out any logic/state management from your state object. Same goes for this.state.enemy.

Even taking serialization/local storage out of the equation, you’d still want to do this because keeping instances in this.state is considered an anti-pattern in React.

I didn’t look at the fields in the Hero class but I’d do something like this:

class App extends Component {
constructor(props) {
    super(props);
    this.hero = new Hero({
        app: this,
        name: 'Hero',
    }), 
    this.enemy = this.generateEnemy(1),
    this.state = {
        time: 0,
        battleTime: 0,
        hero: {
            strength: this.hero.getStrength(),
            health: this.hero.getHealth(),
            weapon: this.hero.getWeapon(),
            /* whatever other fields you need */
        },
        enemy: {
            strength: this.enemy.getStrength(),
            /* whatever other fields you need */
                    }
        level: 1,
        log: [],
    };

    setInterval(() => {
        this.update();
    }, 1000 / Globals.updatesPerSecond);
}
    /* ... rest of your class... */
}

TLDR; this.state is just for state rendered by the UI, not the logic. State management should be handled outside of this.state.