[wiredearp]

In React terms, "functional" almost always implies the opposite of purely functional. It just means that the component is declared by a function instead of a class. First time you call it, the function can assign state that it may reference in future calls, not unlike the methods of a class. How they actually go about this is however almost entirely weird.

[bigDinosaur]

Classes in JS are just functions anyway, and functions can have state. Saving the state of a function is a different thing, but of course JS allows that, too. Why is it weird?

[wiredearp]

Class instances are objects and it's the objects that have state. Functions can only abuse themselves as objects to store state.

function johnson() { johnson.state = {}; }

This is however shared state and the state will be reset whenever the function is called a second time. So what you normally do with a function is to pass the state via arguments and now the same function can work with different states. React could totally do this via props or as a second argument.

function Johnson(props, state) {}

Instead they changed the laws of functions so that a function can act different the first time it is called and also be called the first time multiple times if and when the function calls a functions that looks like JavaScript but follow different rules [1].

This is weird.

[1] https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at...