Why does a State object exist in React?

Question

I have experience with Angular and Vue, and I'm starting to learn React.

Why are all the variables that are not passed from the parent component stored in the state object and not in the root class? Also, why does React require a special method (setState) to change the value of a variable? Variable values ​​can be changed directly, but if setState is not used, the view will not be updated.

In Angular:

this.variableName = 'new value';

In reagent:

this.setState({
  variableName: 'new value'
});

Answer 1

It seems to be a design decision.

, - , push- .. - - . - , , " " ( ). , redux/flux .., , React.

setState - . , React, , Angular, . , , "", state, , , state, props (, , ). setState - , , , Angular "- " /.

, React . DOM = f(State, Props). . , <input> value, onChange. , , - setState value ( ). Angular , AFAIK, value, . , - , , Angular , , React. , , , .

React , Angular, jQuery plain-ol-javascript. , . , React .

Answer 2

, , state, ?

, , , . React DOM. , setState({...})

, React (setState) ?

, , , this.state.bar = foo. . , React React, DOM, .

Facebook , this.setState().