shs
shs

Reputation: 886

Typescript Angular Component, colon vs. equals

I'm experimenting with the angular tutorial at https://angular.io.

After some editing, the code ended up like this:

@Component({
   ...
})
export class HeroesComponent implements OnInit {
  heroes = HEROES;  // here 1
  selectedHero: Hero;  // here 2

  ...
}

There's an assignment with an equal sign followed by what looks like an object initialization.

I don't understand the difference between "here 1" and "here 2". I'm confused by the syntaxes of what appear to be two assignments. What's above is the only form that compiles. Can someone please explain?

Upvotes: 0

Views: 861

Answers (2)

Abhishek Kumar
Abhishek Kumar

Reputation: 2539

heroes = HEROES; // here 1 is assigning value 'HEROES' to the class variable heroes.

selectedHero: Hero; // here 2 is making sure that the class variable 'selectedHero' is of type 'Hero'. This is useful in case of typescript as it will show error(if used with IDE) when a value different from Hero is assigned to variable 'selectedHero'.

This is typescript, and it transpiles. But when in production mode its all compiled in javascript with used features like prototyping. For more javascript compilation you can search the google.

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222592

The first one you are initializing heroes by assigning the array HEROES, the later one you are just declaring the type of selectedHero to be of type Hero

heroes = HEROES;     //Assigning the value
selectedHero: Hero;  //here 2 //Declaring the variable of type

Upvotes: 1

Related Questions