title: Cannot read property 'function' of undefined
body: <p>I am trying to call a function from another function in my React app. But I keep this error: <code>Error in login TypeError: Cannot read property 'loadDashboard' of undefined</code>. I searched for similar cases all I could find was (1) That I have to use <code>this</code> keyword (2) I have to mention the function inside <code>constructor</code>. I have done both then why I keep getting the error??<br>
  My code:     </p>
  
  <pre><code>import React, { Component } from 'react';
  import '../App.css';
  var axios = require('axios');
  
  class Login extends Component {
    constructor(){
      super();
      this.loadDashboard = this.loadDashboard.bind(this);
    }
  
    loadDashboard(token){
      axios({
        method:'get',
        url:'http://localhost:3000/api/dashboard',
        data: {
          Authorization: token
        },
        responseType:'stream'
      })
       .then(function (response) {
         console.log(response);
       })
       .catch(function (error) {
         console.log("Error in loading Dashboard "+error);
       });
    }
  
    handleOnSubmit = () =&gt; {
       console.log("submittwed");
       axios({
         method:'post',
         url:'http://localhost:3000/authenticate',
         data: {
           email: 'test@mail.com',
           password: 'apple'
         },
       })
        .then(function (response) {
          var token = response.data.auth_token;
          console.log(token);
          this.loadDashboard(token);
        })
        .catch(function (error) {
          console.log("Error in login "+error);
        });
     }
  
    render() {
      return (
        &lt;div&gt;
           Username: &lt;input type="email" name="fname" /&gt;&lt;br /&gt;
           Password: &lt;input type="password" name="lname" /&gt;&lt;br /&gt;
           &lt;button onClick={this.handleOnSubmit}&gt;LOG IN&lt;/button&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default Login;        
  </code></pre>
  
  <p><strong>NOTE:</strong> Without <code>loadDashboard</code>, <code>handleOnSubmit</code> function works just fine.           </p>
  
  <p><strong>Also</strong>, why changing <code>loadDashboard(token){..}</code> to <code>function loadDashboard(token){..}</code> gives me <code>Unexpected token</code> error?  </p>