Quiz for Functional Components

Q1: What is a functional component in React?

A. A component defined as a JavaScript function B. A component that uses a class keyword C. A component that manipulates DOM directly D. A component that requires Redux

Q2: Which hook is used for adding state in functional components?

A. useEffect B. useState C. useContext D. useReducer

Q3: Which syntax correctly defines a functional component?

A. class MyComponent extends React.Component {} B. function MyComponent() {} C. new MyComponent() D. React.createComponent()

Q4: How is JSX returned in a functional component?

A. Using return keyword with HTML string B. By rendering to DOM manually C. Using return with JSX code D. Using console.log()

Q5: Which React version introduced hooks for functional components?

A. 15.6 B. 16.0 C. 16.8 D. 17.0

Q6: Are functional components pure functions?

A. Yes, they do not cause side effects B. No, they always mutate props C. Yes, but only when using Redux D. Only when declared using arrow syntax

Q7: Can functional components manage lifecycle?

A. No B. Yes, using lifecycle methods C. Yes, using hooks like useEffect D. Only in class components

Q8: Which of the following is a valid React Hook?

A. useSetState B. useConstructor C. useEffect D. useLifecycle

Q9: Which of these is a benefit of functional components?

A. Require more memory B. Harder to test C. Less readable D. Easier to debug and test

Q10: What do functional components not have?

A. Access to props B. Return statement C. Lifecycle methods like componentDidMount D. JSX

Q11: How are props accessed in functional components?

A. this.props B. props() C. as an argument D. setProps()

Q12: What is required to render multiple elements in React functional components?

A. Surround them with div only B. Use of Fragment or div C. Return them without wrapping D. Using separate return

Q13: What does the useEffect hook replace?

A. componentWillUnmount only B. componentDidCatch only C. componentDidMount and others D. render()

Q14: Are functional components stateless only?

A. Always B. Never C. No, they can be stateful using hooks D. Only before React 16.8

Q15: What is the main input of a functional component?

A. Redux Store B. Hooks C. Props D. State

Q16: Can you memoize functional components?

A. No B. Yes, using React.memo C. Yes, using Redux D. Only with classes

Q17: What will happen if a component returns null?

A. It will crash the app B. Nothing will render C. It throws error D. Only the parent is shown

Q18: Which is a correct way to import useState?

A. import { useState } from "react" B. import useState from "react" C. require("useState") D. React.useState()

Q19: Which keyword is not used in functional components?

A. function B. const C. class D. return

Q20: What happens if you miss return in functional component?

A. App crashes B. Component renders empty C. Props are passed as undefined D. JSX is ignored silently