title: How to fix 'Type Error: Cannot Read Property 'name' of undefined when trying to access properties of an object' in React
body: <p>After updating the state of the component with the promise from a 
      fetch call, I am unable to access the properties of the object. 
      When I console.log the object I see it but when I try to access 
      the property it throws a Type error: Cannot read property 'name' 
      of undefined.
      <code>
      I have tried console.log(Object.keys(filteredStudents[0])) and i 
      get: 
      TypeError: Cannot convert undefined or null to object
  </code>
      class App extends React.Component {
        constructor(prop){
          super(prop)
          this.state = {
            searchField: '',
            students: [],
            menu: 'home'
          }
        }</p>
  
  <pre><code>  componentDidMount() {
  
   fetch('https://jsonplaceholder.typicode.com/users')
   .then(response =&gt; {
          return response.json()
      }).then(data =&gt; {
          // console.log(data);
          this.setState({students: data})
      }).catch(err =&gt; console.log('error', err))
    }
  
    render (){
  ```````````````````````````````````````````````````````````
      const filteredStudents = this.state.students
      console.log(filteredStudents[0])
      console.log(Object.keys(filteredStudents[0]))
   ````````````````````````````````````````````````````````
        );
      }
  
      }
    }
  
  I expect the output to return the value of any key I try to 
   access. e.g 
  console.log(filteredStudents[0].name) -----&gt; 'leanne'
  </code></pre>