Knowledge check: Adding components

Knowledge check: Adding components

  1. Choose the correct statement about the following code:

     <>  
         <h1>...</h1>  
    
         <p>...</p>  
     </>
    
    • This is valid React code. 

    • This is not valid React code

    • This is valid JavaScript code

    • This is a valid HTML tag

  2. In React, you can only have one root element in a component.

    • True

    • False

  3. Which of the following statements are true about JSX?

    Choose all that apply.

    • JSX allows you to use JavaScript functions as attributes

    • JSX allows you to include expressions in your code.

    • JSX elements must be written in all uppercase.

    • JSX elements must be self-closing.

    • JSX elements can have multiple children.

  4. What is the output of the following JSX code block?

     const myList = ['apple', 'banana', 'orange']; 
     const listItems = myList.map((item) => 
       <li key={item}>{item}</li> 
     ); 
     return ( 
       <ul>{listItems}</ul> 
     );
    
    •   <li>apple</li><li>banana</li><li>orange</li>
      
    •   <ul> [<li>apple</li>, <li>banana</li>, <li>orange</li>] </ul>
      
    •   [<ul>,<li>apple</li>, <li>banana</li>, <li>orange</li>,<ul>]
      
    •   <ul><li>apple</li><li>banana</li><li>orange</li></ul>
      
  5. Which of the following is true about props in React?

    • Props should be used for values that will not change within a component.

    • The prop value must be wrapped in quotes.

    • Props should only be used for simple data types, such as strings and numbers.

    • Props are mutable and can be changed within a component.