2017-03-08 63 views
0

我在https://angular.io/上學習Angular2。雖然下面的教程中,我寫出來下面的代碼Angular2中的類和屬性使用

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; 
} 

這裏我想問的是在課堂上的英雄和對象英雄類AppComponent「:」用於聲明並分配值屬性,但爲什麼「=」是用於分配標題屬性的值。

感謝

回答

1

這是因爲在標題中您正在分配一個值。這是普通的JavaScript:

title = 'Tour of Heroes'; 

,而英雄,你是說,你的英雄屬性的類型爲Hero,你也分配給它一個新的價值,這是打字稿:

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

所以你可以做類似於你的標題的東西,雖然它是多餘的:

title:string = 'Tour of Heroes'; 

爲什麼它是多餘的?因爲title是一個原始類型,所以當你爲它分配一個字符串時,typescript已經知道你的title變量是一個字符串類型;

1

聲明hero: Hero是打字稿表達,讓打字稿知道該財產hero將使用Hero打字稿接口。

然後使用=將實際值分配給屬性。

title被忽略的原因是您要傳遞一個簡單的字符串,Typescript推斷title變量的類型必須是string。所以你不必特別定義title的類型。

1

id: number;聲明屬性ID 類型號碼。

title = 'Tour of Heroes';聲明瞭一個屬性標題,並用的值'Tour of Heroes'初始化它。它的類型字符串由TypeScript編譯器推斷出來。但它實際上相當於

title: string = 'Tour of Heroes'; 

這是一些基本的TypeScript語法。 Learn the language

0
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'; 
1

在JavaScript的

等號,=,用於分配變量:

let title = 'Hello'; 

和冒號, ,(在這種情況下)用於分隔從其javascript object

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

在該示例中的第一結腸以上雖然是一個打字稿符號用於指定類型爲主人公變量。

1
title = 'Tour of Heroes'; 

在這裏,你是在說AppComponent類的屬性title有這個價值'Tour of Heroes'
你可以指定這樣的:

title: string = 'Tour of Heroes'; 

但通過指定類型的值:string,打字稿瞭解到,title已經鍵入string,而無需指定。

相反,在這裏:

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

您是說AppComponent類的屬性hero是類型Hero並具有這個值:

{id: 1, name: 'windstorm'} 

所以:聲明的類型屬性。與=你正在分配它的價值。