React Day 03

How can we update state based on the previous state?

• setState(count + 1);

• setState((prev) => prev + 1);

• setState(() => count + 1);

• setState = count + 1;

When does useEffect run if the dependency array is empty ([])?

• Every render

• Only once after the initial render

• When the component is unmountedNever

• Never

What will happen in this code?

useEffect(() => {

console.log("Effect ran!");

}, []);

• Logs "Effect ran!" on every render

• Logs "Effect ran!" once after mounting

• Throws an error

• Does not execute

How do you clean up effects in useEffect?

useEffect(() => {

const interval = setInterval(() => {

console.log("Hello");

}, 1000);

return () => clearInterval(interval);

}, []);

• useCleanup()

• Using return () => {} inside useEffect

• componentWillUnmount()

• No cleanup needed

What is the main purpose of useContext?

• To create state in a component

• To fetch data from an API

• To manage global state without prop drilling

• To handle lifecycle methods

What is the correct way to consume context inside a component?

const MyContext = createContext("default");

const value = ???

• useContext(MyContext);

• <MyContext.Consumer>

• MyContext.Provider

• useState(MyContext);

What is required when using useContext?

• A state variable

• A reducer

• A provider component

• Nothing, it works standalone

What is a custom hook in React?

• A special type of React component

• A function that starts with use and reuses logic

• A built-in React function

• A function that must be inside useEffect

What is the correct syntax for a custom hook?

function useCounter() {

const [count, setCount] = useState(0);

return [count, setCount];

}

• ✅ Valid

• ❌ Invalid

Match the following

• Provides global state management

• Custom Hook

• Runs side effects in components

• useEffect

• Reusable logic function for React

• useState

• Stores state in functional components

• useContext