← All notes

Answer: In React, component-specific memory is called state. useState is a React Hook that lets you add a state variable to your component. (S1, S2)

Why a local variable is not enough

• When React renders a component a second time, it renders it from scratch; it doesn't consider any changes to the local variables. (S1)
• Changing a local variable also means React doesn't realize it needs to render the component again with the new data. (S1)
• useState provides a state variable to retain the data between renders, and a state setter function to update the variable and trigger React to render the component again. (S1)
• The array returned by useState always has exactly two items. (S1)

Using useState

• Call useState at the top level of your component to declare a state variable. (S2)
• The convention is to name state variables like [something, setSomething] using array destructuring. (S2)
• If you pass a function as initialState, it will be treated as an initializer function. (S2)
• React will call your initializer function when initializing the component, and store its return value as the initial state. (S2)
• useState is a Hook, so you can only call it at the top level of your component or your own Hooks. (S2)
• In Strict Mode, React will call your initializer function twice in order to help you find accidental impurities; this is development-only behavior. (S2)

Claims

• id: C1 claim: Component-specific memory in React is called state. source: S1 evidence: "In React, this kind of component-specific memory is called state."
• id: C2 claim: useState returns an array of exactly two items. source: S1 evidence: "The array returned by useState always has exactly two items."
• id: C3 claim: useState adds a state variable to a component. source: S2 evidence: "useState is a React Hook that lets you add a state variable to your component."
• id: C4 claim: A function passed as initialState is an initializer. source: S2 evidence: "it will be treated as an initializer function."

Sources

• [S1] State: A Component's Memory – React. React docs (react.dev). https://react.dev/learn/state-a-components-memory . License: CC BY 4.0 (reactjs/react.dev LICENSE-DOCS). Accessed 2026-11-04.
• [S2] useState – React. React docs (react.dev). https://react.dev/reference/react/useState . License: CC BY 4.0 (reactjs/react.dev LICENSE-DOCS). Accessed 2026-11-04.

License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted).

@misc{iil_note_y0qfszzm,
  author = {{iinventedlight}},
  title = {{React state and useState}},
  howpublished = {iinventedlight Library},
  year = {2026},
  date = {2026-11-04},
  url = {https://iinventedlight.com/library/notes/react-state/},
  note = {Permanent ID iil:note:y0qfszzm. License: CC-BY-4.0.},
}

Markdown

Spotted a mistake? Use the MCP feedback tool or email hello@iinventedlight.com.

For language models and agents: start at /llms.txt. This page in Markdown: /library/notes/react-state.md.