useState hook in React Native - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of the useState hook in React Native?

The useState hook lets you add state to functional components. It helps components remember values between renders, like a counter or user input.

beginner

How do you declare a state variable using useState?

You call <code>const [value, setValue] = useState(initialValue);</code>. <code>value</code> holds the current state, and <code>setValue</code> updates it.

beginner

Why should you use the setter function from useState instead of changing the state variable directly?

Using the setter function tells React Native to update the UI and remember the new state. Changing the variable directly won’t update the screen.

intermediate

What happens when you call the setter function from useState with the same value as the current state?

React Native skips re-rendering because the state didn’t change. This helps keep the app fast by avoiding unnecessary updates.

intermediate

Can you use multiple useState hooks in one component? Why would you do that?

Yes, you can use many useState hooks to keep different pieces of state separate. This makes your code clearer and easier to manage.

What does useState return when you call it?

A A boolean indicating if state changed

B A single value representing the state

C An array with the current state and a function to update it

D A function to update the state only

useState returns an array with two items: the current state value and a setter function to update that state.

Which of these is the correct way to update state using useState?

A changeState(newValue);

B state = newValue;

C updateState(newValue);

D setState(newValue);

You must use the setter function returned by useState, commonly named setState, to update the state.

What is the initial value of state when you call useState() without arguments?

A undefined

B null

C 0

D empty string

If you don’t provide an initial value, the state starts as undefined.

Why might you use multiple useState hooks instead of one with an object?

A To avoid using setter functions

B To keep state updates simple and independent

C Because React Native doesn’t support objects in state

D To reduce the number of renders

Using multiple useState hooks keeps state pieces separate, making updates easier and clearer.

What happens if you call the setter function with a function instead of a value?

A The function receives the current state and returns the new state

B It causes an error

C The state resets to initial value

D The state becomes a function

Passing a function to the setter lets you update state based on the current state safely.

Explain how the useState hook works in React Native and why it is important.

Think about how components remember and update information.

Describe a simple example where you would use multiple useState hooks in one component.

Imagine a form with separate inputs.