Props, short for properties, are read-only inputs that a parent component passes to a child component. They let data flow down the component tree.
// Parent component
function App() {
return <Welcome name="John" age={25} />;
}
// Child component
function Welcome(props) {
return <h1>Hello, {props.name}! You are {props.age} years old.</h1>;
}
A child treats its props as immutable. It reads them to decide what to render and never changes them. A prop can be any JavaScript value, such as a string, a number or an object. Function props work too, which is how a child tells its parent that something happened.
Rewriting in plainer words…
This answer doesn't lend itself to a diagram - it reads best . No credits were charged.
Saved in this browser - sign in to keep your review list.
How should your speech become text?
Listening… your words appear above as you speak - tap Stop when you're done.
Recording · cr - tap Stop & transcribe when you're done.
Transcribing with AI…
Voice:
Keep going - a few more words and AI can grade it.
Interview lens
How interviewers actually use this question
Likely follow-ups
How is a prop different from state?Props come from the parent and the child can't change them. State belongs to the component itself, and updating it triggers a re-render.
What goes wrong if a child mutates an object it received as a prop?The parent's data changes with no state update, so React gets no signal to re-render and the screen goes stale. Ask the parent to change it instead.
What is the children prop and when would you use it?Whatever sits between a component's opening and closing tags arrives as props.children. Useful for wrappers like layouts, cards and modals.
Props are the inputs a parent component passes to a child, a lot like arguments to a function.
You write them as attributes in JSX, so App can render Welcome with a name and an age, and Welcome reads props.name to decide what to show.
They're read-only. The child never changes its props, it just renders from them, so data only flows down the tree.
A prop can be any JavaScript value, like a string, a number, an object or a function.
Passing a function is how the child talks back. It calls the function when something happens and the parent decides what changes.
The catch is that props only go one level down, so shared data can end up threaded through layers that never use it, and that's when I'd reach for composition or Context.
Weak answers to avoid
Treats props and state as the same thingProps come from the parent and are read-only for the child. State is owned by the component. Blurring the two signals shaky basics.
Says the child can update its own propsProps are read-only. If the value has to change, keep it in the parent's state and pass down a function the child calls to change it.
Only mentions strings and numbersProps can be any value. Leaving out function props misses how a child reports events to its parent, which is the obvious next question.
Recites a definition with no exampleSketch a two-line parent and child out loud. It shows you've actually written components and sets up the one-way data flow point.
Interview lens
Likely follow-ups, what you can say, and the weak answers to avoid.
