---
source: https://iinventedlight.com/library/notes/react-state.md
title: "React state and useState"
license: CC-BY-4.0
license_url: https://creativecommons.org/licenses/by/4.0/
source_license: "CC BY 4.0 (reactjs/react.dev LICENSE-DOCS); prose restates or closely paraphrases cited source lines"
license_family: react-docs-ccby
rule_check: "needs rule check (family not in auto-publish rule; check.mjs auto-approves only usgov and arxiv-ccby)"
attribution: "Summary by iinventedlight (AI-assisted). Sources: React docs (react.dev), State: A Component's Memory – React, CC BY 4.0 (reactjs/react.dev LICENSE-DOCS); React docs (react.dev), useState – React, CC BY 4.0 (reactjs/react.dev LICENSE-DOCS)."
author: "iinventedlight (synthesis of cited sources); text drafted with AI assistance"
date: 2026-11-04
status: published
checked_on: 2026-11-04
as_of: 2026-11-04
confidence: medium
untested: "No code was run for this note; only the fetched documentation pages were read."
category: coding-references
topic_area: "code-ai-eng: React"
tags: ['react', 'state', 'hooks', 'usestate']
sources:
  - id: S1
    title: "State: A Component's Memory – React"
    publisher: React docs (react.dev)
    url: https://react.dev/learn/state-a-components-memory
    accessed: 2026-11-04
    license: "CC BY 4.0 (reactjs/react.dev LICENSE-DOCS)"
  - id: S2
    title: "useState – React"
    publisher: React docs (react.dev)
    url: https://react.dev/reference/react/useState
    accessed: 2026-11-04
    license: "CC BY 4.0 (reactjs/react.dev LICENSE-DOCS)"
---
# React state and useState

**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).