Quiz for Index as Key – Pros and Cons

Q1: What is a key purpose of using keys in React lists?

A. To uniquely identify elements B. To reorder elements randomly C. To style elements uniquely D. To increase memory usage

Q2: When is using index as key acceptable in React?

A. Always B. Only when items are added at the end C. When list items have stable identity D. When the list is static and does not change

Q3: What is a disadvantage of using index as key in dynamic lists?

A. Performance improves B. Items may not re-render correctly C. Memory leak occurs D. Component tree resets

Q4: Which of the following is a best practice when assigning keys in React?

A. Use array index B. Use a unique id C. Use class name D. Use object reference

Q5: What happens if no key is provided in a React list?

A. React throws an error B. The list will not render C. React uses array index as fallback D. The browser crashes

Q6: In which scenario is it NOT recommended to use index as a key?

A. When list has stable data B. When list is reversed or sorted C. When rendering a static list D. When styling list items

Q7: How does React use keys internally?

A. To style list items B. To cache previous render values C. To identify which items changed D. To fetch new data

Q8: What problem can arise from using index as key in a list where items are reordered?

A. React optimizes rendering B. List items animate automatically C. Incorrect DOM elements are reused D. State is always preserved

Q9: Which key choice is considered the most reliable for lists?

A. Array index B. Random number C. Stable unique ID D. Timestamp

Q10: Why does using a non-unique key cause issues in React?

A. It increases memory usage B. It slows down performance C. It causes incorrect component re-renders D. It blocks the UI thread

Q11: When rendering a list of inputs, what’s the issue with using index as key?

A. Inputs get focus automatically B. Inputs may lose focus or state C. Inputs render faster D. Inputs look different

Q12: What is the React developer warning when keys are not unique?

A. Key mismatch B. Duplicate key C. Missing key warning D. Each child in a list should have a unique key

Q13: If the list data changes frequently, what key strategy is best?

A. Use index B. Use fixed string C. Use UUID or database ID D. Use array length

Q14: What’s the result of reusing array index as key across renders?

A. Stable rendering B. State may shift between items C. Faster list display D. Accurate diffing

Q15: Which key method should be avoided for a to-do list with deletions?

A. Database ID B. UUID C. Array index D. Slug

Q16: Which factor makes a key "stable"?

A. Randomized each render B. Changes based on user input C. Remains same across renders D. Changes on button click

Q17: What issue occurs if React cannot uniquely identify items?

A. Memory leak B. Flickering UI C. Reordering issues D. Incorrect DOM updates

Q18: What is a fallback behavior when using same key for all items?

A. No rendering B. Random DOM output C. React throws exception D. Last item may replace others

Q19: Which of the following can be a valid key?

A. Math.random() B. Item.id C. Element.innerHTML D. Object reference

Q20: In React, what does key help with specifically during reconciliation?

A. Finding closest node B. Speeding up loading C. Matching old and new elements D. Sorting list