Props

Props are read-only inputs from a parent to a child. React data flow is one-way: parents pass values and callbacks down; children notify parents through those callbacks instead of mutating parent state directly. The `children` prop is a special slot for composition.

Destructure props at the boundary for clarity, but avoid spreading unknown objects onto DOM nodes. Default values and TypeScript interfaces document the contract. When a child needs to change data, lift state to the nearest common owner.

Interviewers probe whether you can design controlled components: value plus `onChange` from the parent, with the child remaining a thin view.

On interviews, explain the concept with a concrete example and name the behavior interviewers probe.

Common pitfalls include hiding data flow, over-splitting components, and putting side effects in render.

The trade-off is often clarity versus reuse or explicit props versus convenience.

Checklist:

• Treat props as immutable inside the child.
• Use callbacks to report events upward.
• Prefer explicit props over implicit context for local flows.