Quiz for Rendering Lists

Q1: Which method is commonly used to render a list of items in React?

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

Q2: What should you include when rendering a list of elements in React?

A. A unique key prop B. The index as a string C. Random number D. Name of the item

Q3: Why are keys important when rendering lists in React?

A. For SEO B. For styling C. For identifying elements in the DOM D. For helping React identify which items have changed

Q4: What is a good practice when using the index of the array as a key in React?

A. Always use index B. Use index only if the list is static C. Never use index D. Use index if elements are unique

Q5: How do you convert an array of strings into a list of <li> elements?

A. array.join() B. array.forEach() C. array.map() D. array.reduce()

Q6: What type of value should be passed to the key prop?

A. Boolean B. Array C. Unique identifier D. Function

Q7: Which of the following is NOT a valid way to render a list in React?

A. Using map() B. Using for loop inside JSX C. Using map() inside JSX D. Returning array of components

Q8: What will happen if you do not use keys in a list?

A. React will ignore rendering B. It will work perfectly C. React will show an error D. React may not efficiently update items

Q9: Where should you assign the key prop?

A. To the parent element B. To the array itself C. To each element inside the map function D. To a wrapping div only

Q10: Is it acceptable to use object references as keys in React?

A. Yes B. No C. Only for primitive objects D. Only in functional components

Q11: What does this code do? `items.map(item => <li key={item.id}>{item.name}</li>)`

A. Renders a list of strings B. Renders a list of components with keys C. Throws an error D. Loops over strings only

Q12: In React, which statement is true about list rendering?

A. You must always wrap lists in a <form> B. Keys are required in all HTML elements C. You can render a list with map() D. Lists require useEffect()

Q13: Can you return an array of components from a React component?

A. Yes B. No C. Only in class components D. Only if wrapped in div

Q14: What does this produce? `[<div key="1" />, <div key="2" />]`

A. Syntax error B. Array of divs with keys C. Single div D. Undefined

Q15: What is the primary purpose of the `key` prop in list rendering?

A. Apply CSS styles B. Maintain performance and tracking changes C. Bind event handlers D. Initialize state

Q16: Which function in JSX returns elements for rendering a list?

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

Q17: What is true about map() in JSX?

A. Cannot be used B. Only used for numbers C. Used for rendering arrays of elements D. Used for filtering arrays

Q18: How can you render multiple lines of JSX in map?

A. Return multiple strings B. Wrap returned JSX in () C. Use only one element D. Add index to JSX

Q19: Which of the following keys is NOT a good practice?

A. Using item.id B. Using UUID C. Using Math.random() D. Using static strings

Q20: If two elements have the same key, what could happen?

A. Faster rendering B. No change C. Unexpected rendering behavior D. Error in compilation