title: How does variable declaration differ between the `class` and `constructor`?
body: <p>I have seen an example, and I am trying to reproduce it. The <code>name</code> and <code>age</code> are declared inside the <code>class</code> and <code>services</code> ( Injectable ) added in the <code>constructor</code>.</p>
  
  <p>I'd like to know the difference between declaring variable with <code>class</code> and <code>constructor</code> here. Any one help me to know the differences.</p>
  
  <p>As well instead of declaring the <code>name</code> and <code>age</code> can't I declare inside of the <code>constructor</code> itself?</p>
  
  <p>here is my code :</p>
  
  <pre><code>    import {Component} from 'angular2/core';
      import {CommonService} from './commonService';
      import {commonServiceIndipendent} from './commonSerivceIndipendent';
  
      @Component({
  
        selector : 'component1',
  
        template : `
  
          &lt;h1&gt;Component 1&lt;/h1&gt;
          &lt;input type="text" #message /&gt;
  
          &lt;button (click)="onLog(message.value)" &gt;Component1 - Message &lt;/button&gt;
  
        `,
  
        providers:[commonServiceIndipendent]
  
      })
  
      export class Component1 {
  
        name:string; //why here?
        age:number; //why here?
  
  //can't i add to constructor? if so how?
        constructor ( 
          private _commonService : CommonService, 
          private _commonServiceIndipendent:commonServiceIndipendent) {}
  
  
        //sending to same service. it has other instance in history
        onLog(message:string) {
  
          this._commonService.log( message );
  
          this.name = "Arif",
          this.age = 20;
  
          this.onData();
  
        }
  
        onData() {
          this._commonServiceIndipendent.myData(this.name,this.age);
        }
  
      }
  </code></pre>