title: TypeError: Cannot read property 'list' of null
body: <p>Here is the code that is giving me an error:</p>
  
  <pre><code>import React, { Component } from 'react'
  import Header from './components/Header';
  import Todo from './components/Todo';
  
  class App extends Component {
    state: {
      list: [
        {
          title: "Take out trash",
          completed: false,
          id: 1
        },
        {
          title: "Take dog for walk",
          completed: false,
          id: 2
        },
        {
          title: "Doctor appointment",
          completed: false,
          id: 3
        }
      ];
    }
  
    render() {
      return (
        &lt;div className="container"&gt;
          &lt;Header number={this.state.list.length} /&gt;
          &lt;Todo/&gt;
        &lt;/div&gt;
      )
    }
  }
  
  export default App
  </code></pre>
  
  <p>The message says it couldn't read 'this' when I was passing in the array as a prop to header. Aren't am I allowed to do this though? Why is the keyword 'this' undefined if its in a class component?</p>