Использование классов и свойств в Angular2

Я изучаю Angular2 на https://angular.io/. Следуя руководству, я заканчиваю тем, что пишу следующий код

import { Component } from '@angular/core';

@Component({
 selector: 'app-root',
 templateUrl: './app.component.html',
 styleUrls: ['./app.component.css']
})
export class AppComponent {
 title = 'Tour of Heroes';
 hero: Hero = {
   id: 1,
   name: 'windstorm'
 };
}

export class Hero {
 id: number;
 name: string;
}

Здесь мой вопрос в классе Hero и объекте hero в классе AppComponent ":" используется для объявления и присвоения значений свойствам, но почему "=" используется для присвоения значений свойства title.

Спасибо


angular
person Manish    schedule 08.03.2017    source источник

Ответы (6)


arrow_upward
1
arrow_downward

Это потому, что в заголовке вы присваиваете значение. Это обычный javascript:

title = 'Tour of Heroes';

В то время как герой, вы говорите, что ваше свойство героя имеет тип Hero, и вы также присваиваете ему новое значение, это машинопись:

hero: Hero = {
   id: 1,
   name: 'windstorm'
 };

Таким образом, вы можете сделать что-то похожее на свой заголовок, хотя это избыточно:

 title:string = 'Tour of Heroes';

Почему это лишнее? поскольку title является примитивным типом, когда вы присваиваете ему строку, typescript уже знает, что ваша переменная title имеет строковый тип;

person Fabio Antunes    schedule 08.03.2017

arrow_upward
1
arrow_downward

Оператор hero: Hero — это выражение Typescript, которое сообщает Typescript, что свойство hero будет использовать интерфейс Hero Typescript.

Затем с помощью = фактическое значение присваивается свойству.

Причина, по которой это было опущено для title, заключается в том, что вы передаете ему простую строку, а Typescript делает вывод, что тип переменной title должен быть string. Таким образом, вам не нужно специально определять тип title.

person Anton v B    schedule 08.03.2017

arrow_upward
1
arrow_downward

id: number; объявляет идентификатор свойства с номером типа.

title = 'Tour of Heroes'; объявляет название свойства и инициализирует его значением "Tour of Heroes". Его тип, строка, выводится компилятором TypeScript. Но на самом деле это эквивалентно

title: string = 'Tour of Heroes';

Это несколько базовый синтаксис TypeScript. Выучите язык.

person JB Nizet    schedule 08.03.2017

arrow_upward
1
arrow_downward

В JavaScript

Знак равенства = используется для присвоения переменных:

let title = 'Hello';

А двоеточие : (в данном случае) используется для отделения ключа от его значения в javascript object:

let hero: Hero = {
   id: 1,
   name: 'windstorm'
 };

Однако первое двоеточие в приведенном выше примере — это нотация машинописного текста для указания типа для переменной hero.

person Fredrik Lundin    schedule 08.03.2017

arrow_upward
1
arrow_downward 

title = 'Tour of Heroes';

Здесь вы говорите, что свойство title класса AppComponent имеет это значение 'Tour of Heroes'.
Вы могли бы указать так:

title: string = 'Tour of Heroes';

Но, присваивая значение типа: string, TypeScript понимает, что title уже является типом string, без необходимости указывать его.

Вместо этого здесь:

  hero: Hero = {
   id: 1,
   name: 'windstorm'
 };

Вы говорите, что свойство hero класса AppComponent относится к типу Hero и имеет следующее значение:

{id: 1, name: 'windstorm'}

Таким образом, с помощью : вы объявляете тип свойства. С помощью = вы присваиваете ему значение.

person SrAxi    schedule 08.03.2017

arrow_upward
0
arrow_downward 

hero: Hero = {
   id: 1,
   name: 'windstorm'
 };

В данном случае Hero — это класс героя. Затем (с помощью "=" ) вы назначаете объект JS { id: 1, name: 'windstorm'}; вашей переменной hero.

title = 'Tour of Heroes';

Здесь вы просто присваиваете значение переменной, не указывая ее тип.

title : string = 'Tour of Heroes';

или даже

title : any = 'Tour of Heroes';
person YounesM    schedule 08.03.2017