2.1　語法結構

我們先看一段簡單的代碼，通過該案例了解TypeScript的語法結構。

let testScore:number = 100;
// 判斷分數是否達到通過標準
if (testScore >= 60){
    console.log("考試通過!");
}

對于已經掌握一門編程語言的讀者來說，這段代碼十分簡單。接下來，我們拆分這段代碼的各個元素，講解不同的組成部分。圖2-1展示了示例代碼的組成部分。

圖2-1　示例代碼的組成部分

2.1.1　聲明變量

本例使用聲明符let來聲明變量。以下代碼用于聲明一個名為testScore、類型為數值（number）的變量，并將數值20賦給它。

let testScore:number = 20; 

TypeScript使用let語句聲明變量，語法如下。

let 變量名稱:數據類型=初始值;

let是在ECMAScript 6標準中新增的變量聲明語句。在TypeScript中，let的使用方式與ECMAScript 6標準中的完全相同。在本書中推薦使用let來聲明變量，不推薦使用落后的var來聲明變量。var聲明可能會導致各種意想不到的問題，感興趣的讀者可以自行在網上搜索這些問題。

2.1.2　標識符名稱

在本例中，變量的名稱為testScore。

變量是標識符的一種，在TypeScript中，標識符指變量、函數、參數、類、屬性等的名字。標識符的命名必須遵循兩條規則。

首先，標識符的名稱可以由字母、下畫線“_”、$符號或數字組成，但首個字符不能是數字。

以下是符合規則的命名。

a
_bc
$$de
fg123

以下是不符合規則的命名。

1a
,we.?

其次，標識符的名稱不能是TypeScript本身已經占用的名稱（示例代碼中的let、number、if等都是已經被TypeScript占用的名稱）。

同時還需注意，TypeScript中的一切名稱都區分大小寫。例如，testScore和TestScore分別表示兩個不同的變量。同樣地，let是TypeScript中的關鍵字，無法用它來作為變量或函數的名稱，但LET可以。

2.1.3　數據類型

在本例中，變量的數據類型是數值（number）。

與JavaScript不同，TypeScript擁有完善的類型機制來處理相應的數據。在TypeScript中，基本類型包括原始類型（本例中的數值類型屬于原始類型之一）和對象類型，進階類型包括聯合類型、交叉類型和泛型等，這些類型將在后面詳細介紹。

TypeScript在聲明變量時就可以指定數據類型，這也是TypeScript的核心優勢之一。TypeScript編譯器能基于數據類型進行靜態檢查，提前發現代碼中的問題。

在賦值表達式中，數據類型并不是必需的，TypeScript會根據實際的初始賦值自動推導出變量的數據類型，并將該類型作為操作和檢查的依據，示例代碼如下。

let a = 1;  //實際等同于let a:number = 1

此時，變量a的值為字符串值，示例代碼如下。

a = "hello";

即使沒有明確指出變量a的類型，TypeScript也能推導出它是數值類型，如果賦給它其他類型的值，問題窗口中將提示錯誤消息，如圖2-2所示。

圖2-2　錯誤消息

雖然數據類型可以省略，但為了保持代碼的可讀性，建議在任何時候都保留數據類型的定義。

2.1.4　運算符

使用運算符可將一個或多個值連接起來，形成表達式并進行計算，得到一個結果值。

在本例中，使用了兩個運算符。

● 賦值運算符“=”，表示將運算符“=”右邊的值賦給左邊的變量。

● 比較運算符“>=”，表示判斷運算符左側的值是否大于或等于右側的值，得出比較結果——是（true）或否（false）。

在TypeScript中，常用的運算符包括賦值運算符、算術運算符（加減乘除等計算）、比較運算符（比大小）、邏輯運算符（判斷與、或者、非等邏輯）和條件運算符（根據不同情況得出不同結果）等。

大多數運算符（如“+”和“?”等）是用符號表示的。少部分運算符（如is、as和typeof等）是由關鍵字表示的。

后面會詳細介紹各種運算符。

2.1.5　字面量

在前面的示例中，字面量為數字100、60和字符串“考試通過!”

字面量即代碼中直接使用的明文數據值，例如，以下數據值都是字面量。

123        //整數
12.3       //小數
"hello"    //字符串
true       //布爾值
null       //空{a:1,b:2}  //對象
[1,2,3,4]  //數組

2.1.6　分號與斷句

TypeScript使用分號“;”作為一句話的結尾，將這句話與其他語句分隔開。在本例中，使用分號作為賦值語句的結尾。

let testScore:number = 100;

分號并不是必需的，如果每條語句都不在同一行上，也可以省略句末的分號，示例代碼如下。

let testScore:number = 100

如果多條語句寫到同一行上，則必須以分號結尾，分隔多條語句，示例代碼如下。

let a:number=10; let b:number=20

如果一條語句寫到多行上，并且語句包含運算符，則情況又將不同。由于運算符會連接其左右的值，因此即使分開寫到多行上，也會被解析成一行，示例代碼如下。

let a:number =
1
+
2

以上代碼等同于以下代碼。

let a:number = 1 + 2;

除非遇到特殊情況，否則所有代碼都建議使用分號分隔，并且一行只寫一條語句，以提升代碼的可讀性和整潔性。

2.1.7　注釋

在本例中，注釋為以下語句。

// 判斷分數是否達到通過標準

注釋中的句子將會忽略，不會執行。

注釋通常用于給代碼添加說明，在TypeScript中，注釋可分為單行注釋和多行注釋。

單行注釋以兩條斜杠開頭，注釋文字需要和斜杠保持在同一行中，示例代碼如下。

// 單行注釋

多行注釋以一條斜杠和一個星號“/＊”開頭，以一個星號和一條斜杠“＊/”結尾，注釋文字放在注釋開始符與注釋結束符之間，示例代碼如下。

/＊多
   行
   注
   釋
＊/

2.1.8　表達式

表達式由兩部分——運算符及其所連接的數據組成。每一個表達式都會產生一個結果值。

在本例中，表達式為testScore >= 60。使用比較運算符“>=”連接其左右兩側的數據，形成表達式，該表達式將產生一個布爾類型的值。當testScore的值大于或等于60時，返回true；否則，返回false。

表達式產生的值可以賦給其他變量，或用于流程語句的判斷。

2.1.9　流程控制

通過流程控制語句，決定接下來的代碼是否執行或怎樣執行，改變代碼的執行順序。

默認情況下，所有的代碼都是按照從上到下、從左到右的順序依次執行的。圖2-3所示為默認執行流程。

圖2-3　默認執行流程

使用兩種語句——選擇語句或循環語句改變原有的執行順序。

選擇語句根據條件判斷接下來該執行哪些代碼，圖2-4所示為選擇流程。常見的選擇語句有if、if…else、if…else if及switch等。

圖2-4　選擇流程

在本例中，使用選擇語句來實現流程控制。

if (testScore >= 60)

如果變量testScore的值大于或等于60，則執行if后的語句；否則；不執行。

循環語句根據條件判斷是否反復執行某一段代碼。圖2-5所示為循環流程。常見的循環語句有for、while、do…while等。

圖2-5 循環流程

后面將一一介紹這些流程控制語句。

2.1.10　代碼塊

本例中的代碼塊如下，在代碼塊中有一行語句，它表示在命令行或控制臺中輸出“考試通過!”。

{
    console.log("考試通過!");
}

在TypeScript中，以左花括號“{”開頭，以右花括號“}”結尾，形成代碼塊，將多條語句組合到一個代碼塊中，將其視作一個整體來組織、管理和運行，示例代碼如下。

if (a > 20){
    let b:number = 30;
    c = a + b;
    console.log(c);
}

代碼塊將決定變量的作用域，決定其使用范圍究竟是整個TypeScript程序、某個類還是某個局部代碼塊，后面將詳細介紹代碼塊的知識。

通常來說，在使用函數或類等聲明語句時，都必須使用代碼塊，并將函數或類的所有相關代碼放置其中。當使用流程控制語句時，只需在執行多條語句的情況下使用代碼塊，但推薦都使用代碼塊，以提升代碼的可讀性。