🔹MCQs Of Class 5: State in React

Rashmi Mishra
0

 

 ðŸ”¹MCQs Of Class 5: State in React


Basic Concepts – useState (1–10)

1.   What is the purpose of the useState hook in React?
A) To create class components
B) To manage component-level state ✅
C) To handle props
D) To fetch API data

2.   Which of the following is the correct syntax to declare state using useState?
A) useState = [state, setState](initialValue)
B) const state = useState(initialValue)
C) const [state, setState] = useState(initialValue) ✅
D) let state = useState(initialValue)

3.   What does useState return?
A) One variable
B) Two functions
C) An object
D) An array with two values ✅

4.   What is the initial value of state?
A) Always 0
B) Always null
C) Passed to useState() as an argument ✅
D) Undefined

5.   What will useState(5) initialize?
A) State with 0
B) State with 5 ✅
C) Error
D) Undefined

6.   What is the correct way to update state?
A) count++
B) this.setState(count)
C) setCount(count + 1) ✅
D) count = setCount + 1

7.   Can we call useState inside a loop?
A) Yes
B) No ✅
C) Only in class components
D) Only if wrapped in a function

8.   Which import is needed for useState?
A) import useState from 'react-dom'
B) import { useState } from 'react' ✅
C) import useState from 'react-native'
D) useState is global, no import required

9.   What type of hook is useState?
A) Lifecycle hook
B) Data fetching hook
C) State hook ✅
D) Router hook

10.                   What triggers re-render in a React component?
A) console.log()
B) setState call ✅
C) CSS changes
D) HTML element updates


Practical Implementation (11–20)

11.                   What happens after setCount(count + 1)?
A) Nothing
B) count changes immediately
C) The component re-renders with updated value ✅
D) It crashes the app

12.                   What happens if you update state directly?
A) Works fine
B) Causes re-render
C) May not re-render ✅
D) Automatically uses setState

13.                   Which is true about state in functional components?
A) It can't be used
B) It can only be used in class components
C) It is managed using useState ✅
D) It’s not supported in hooks

14.                   Is useState synchronous or asynchronous?
A) Synchronous
B) Asynchronous ✅
C) Static
D) Callback-based

15.                   What will be the result of calling setCount(count + 1) twice in a row?
A) Adds 2
B) Adds 1 twice
C) Only first update is used ✅
D) Subtracts 1

16.                   How do you display state in JSX?
A) {{count}}
B) {count} ✅
C) [count]
D) state(count)

17.                   Which is the correct way to reset count to zero?
A) setCount(null)
B) setCount(0) ✅
C) reset(count)
D) count = 0

18.                   Which function is used to update a value using useState?
A) setData()
B) setState()
C) setVariable()
D) Custom setter returned by useState ✅

19.                   What is stored in count in the syntax const [count, setCount] = useState(0)?
A) The updater function
B) The old value
C) The current value of count ✅
D) The initial string

20.                   What should you not do with useState?
A) Use in top-level function
B) Use in conditionals ✅
C) Store arrays
D) Store strings


Counter & Interaction (21–30)

21.                   What is the default value in useState(10)?
A) 0
B) 10 ✅
C) Null
D) Undefined

22.                   How do you increment a value by 5?
A) setCount(count + 5) ✅
B) setCount = count + 5
C) count += 5
D) count++

23.                   Which function is used for a button click?
A) handleClick()
B) onClick ✅
C) onChange
D) onSubmit

24.                   How do you stop count from going below 0?
A) if(count >= 0)
B) disabled={count <= 0} ✅
C) setCount = 0
D) return 0

25.                   How do you store a step value in React?
A) Use global variable
B) Use useEffect
C) Use another useState ✅
D) Use Math.random()

26.                   Can you store arrays and objects in state?
A) Only strings allowed
B) Only numbers allowed
C) Yes ✅
D) No

27.                   How do you prevent count from exceeding 20?
A) if (count > 20) setCount(20)
B) onClick={() => count < 20 && setCount(count + 1)} ✅
C) setCount(count++)
D) max(count, 20)

28.                   What is the main use of state?
A) Static HTML
B) Conditional rendering ✅
C) Routing
D) Styling

29.                   What type of variable is step in [step, setStep] = useState(2)?
A) Class
B) Static
C) State ✅
D) Prop

30.                   What happens when setCount() is called?
A) Page reloads
B) Data deleted
C) Component re-renders ✅
D) Component unmounts


Intermediate Concepts (31–40)

31.                   Why should we not update state directly?
A) It causes memory leak
B) It doesn't trigger a re-render ✅
C) It makes app faster
D) It works in class only

32.                   How many states can a component have?
A) 1 only
B) Multiple ✅
C) 2
D) Unlimited, but only in class

33.                   Can useState be used in class components?
A) Yes
B) No ✅
C) Only with a hook wrapper
D) If state is global

34.                   useState(true) will initialize:
A) A string
B) A number
C) A boolean ✅
D) Undefined

35.                   What hook is best suited to store form input?
A) useEffect
B) useRef
C) useState ✅
D) useForm

36.                   Which of the following causes a component to rerender?
A) CSS update
B) State change ✅
C) Function call
D) Console.log

37.                   Can a single component use multiple useState calls?
A) No
B) Yes ✅
C) Only with class
D) Only in parent component

38.                   What will this code print?

js

CopyEdit

const [x, setX] = useState(1);

setX(x + 1);

console.log(x);

A) Updated value
B) Old value ✅
C) Error
D) 2

39.                   What type of data can be stored in state?
A) Only integers
B) Only strings
C) Any data type ✅
D) Only arrays

40.                   How can you dynamically update a value using input?
A) onChange with useState ✅
B) onClick
C) onclick
D) setTimeout


Advanced Understanding (41–50)

41.                   Can we conditionally call useState inside if blocks?
A) Yes
B) No ✅
C) In class only
D) With wrapper

42.                   What happens if you change state in an infinite loop?
A) App runs faster
B) App crashes ✅
C) No effect
D) Works fine

43.                   What is the correct file to import React and useState?
A) react-dom
B) react ✅
C) react-router
D) redux

44.                   How to display previous count?
A) useEffect
B) Store in another state ✅
C) Use console.log
D) Not possible

45.                   useState([]) is used to initialize what?
A) Number
B) Object
C) Array ✅
D) Boolean

46.                   State updates are:
A) Immediate
B) Blocking
C) Asynchronous ✅
D) Synchronous

47.                   How to style components conditionally?
A) CSS only
B) Based on state ✅
C) No styling
D) Use <style> tags

48.                   What is the role of the second item in useState array?
A) Holds data
B) Updates state ✅
C) Logs data
D) Used in classes only

49.                   In JSX, which is valid?
A) {{count}}
B) {count} ✅
C) count
D) @count

50.                   If a component doesn’t use state, it is:
A) Class component
B) Stateless ✅
C) Styled
D) API component

 

Tags

Post a Comment

0Comments

Post a Comment (0)