title: "this" keyword with multiple objects
body: <p>I understand that "this" keyword refers to the currrent/immediate object. While watching a React.js tutorial, I saw the instructor using the keyword with multiple objects. The code looks like this:</p>
  
  <pre><code>class Counter extends Component {
    state = {
      count: 0
    };
  
    styles = {
      fontSize: 10
    };
  
    render() {
      return (
        &lt;div&gt;
          &lt;h1 style={this.styles}&gt;Hello&lt;/h1&gt;
          &lt;span&gt;{this.formatCount()}&lt;/span&gt;
        &lt;/div&gt;
      );
    }
  
    formatCount() {
      const { count } = this.state;
      return count === 0 ? "Zero" : count;
    }
  }
  </code></pre>
  
  <p>Inside formatCount(), why we are referring to <code>this.state</code> instead of <code>state.count</code> ? Also, why not <code>formatCount()</code>  instead of <code>this.formatCount()</code>? The instructor keeps saying <code>this</code> refers to the current object, but he is writing <code>this.objectname.properties</code> everytime. Why is that? Can't I distinguish the objects only with the objectname?</p>