Quiz for Using Keys

Q1: What is the main purpose of keys in React lists?

A. To uniquely identify elements B. To style list items C. To trigger re-renders D. To sort list elements

Q2: Which of the following is NOT a recommended key to use in React lists?

A. A unique ID from data B. Index of the element C. Database primary key D. UUID string

Q3: Where should the key prop be placed in a list?

A. Inside the child component B. On the array element C. On the component returned from map() D. Outside of JSX

Q4: What happens if keys are not provided when rendering a list?

A. React crashes B. Performance issues may occur C. Nothing D. List won’t be rendered

Q5: Can two elements in a list have the same key?

A. Yes B. No C. Only in nested lists D. Only if list is static

Q6: Why is using array index as a key a bad practice?

A. It causes syntax errors B. It’s not unique C. It leads to UI bugs when items reorder D. It consumes more memory

Q7: Which scenario is suitable for using array index as key?

A. Static list B. Dynamic list with deletions C. Sortable list D. List with user interactions

Q8: What does React use the key prop for internally?

A. Tracking form state B. Identifying components in the DOM tree C. Optimizing CSS rendering D. Detecting syntax errors

Q9: What is the result of duplicate keys in a list?

A. Error at compile time B. Only first element rendered C. Render order changes D. Unpredictable component behavior

Q10: Is it okay to generate random keys each time the component renders?

A. Yes B. No C. Only in class components D. Only if performance isn’t an issue

Q11: When mapping over data, which attribute is recommended to use as a key?

A. Element name B. Custom style class C. A unique ID from data D. Component name

Q12: Can keys be strings?

A. Yes B. No C. Only numbers allowed D. Only symbols allowed

Q13: What should you do if your data lacks unique IDs?

A. Use index B. Generate unique IDs C. Omit keys D. Duplicate keys

Q14: In React, which function is commonly used with keys?

A. .forEach() B. .filter() C. .map() D. .reduce()

Q15: What does the absence of a key prop in a list element lead to?

A. Compilation error B. Warning in console C. Automatic key generation D. No effect

Q16: How does React behave with stable keys?

A. Performs unnecessary DOM updates B. Skips component rendering C. Reuses elements efficiently D. Always reorders elements

Q17: What’s the effect of changing keys during each render?

A. Performance boost B. Faster list rendering C. Inconsistent UI behavior D. Improved reusability

Q18: What is the purpose of providing a unique key for list items?

A. Accessibility enhancement B. CSS styling C. DOM element tracking D. Event binding

Q19: If your list has objects with IDs, which field should you use as key?

A. Name B. Index C. ID D. Timestamp

Q20: What happens if you forget to include keys in a dynamically generated list?

A. List will not display B. React crashes C. React will warn and possibly re-render incorrectly D. The first item is duplicated