1、TypeScript 變量聲明

變量是一種使用方便的占位符，用于引用計算機內存地址。

我們可以把變量看做存儲數據的容器。

TypeScript 變量的命名規則：

• 變量名稱可以包含數字和字母。
• 除了下劃線 _ 和美元 $ 符號外，不能包含其他特殊字符，包括空格。
• 變量名不能以數字開頭。

變量使用前必須先聲明，我們可以使用 var 來聲明變量。

我們可以使用以下四種方式來聲明變量：

聲明變量的類型及初始值：

var [變量名] : [類型] = 值;復制

例如：

var uname:string = "Runoob";復制

聲明變量的類型，但沒有初始值，變量值會設置為 undefined：

var [變量名] : [類型];復制

例如：

var uname:string;復制

聲明變量并初始值，但不設置類型，該變量可以是任意類型：

var [變量名] = 值;復制

例如：

var uname = "Runoob";復制

聲明變量沒有設置類型和初始值，類型可以是任意類型，默認初始值為 undefined：

var [變量名];復制

例如：

var uname;復制

實例

var uname:string = "Runoob";

var score1:number = 50;

var score2:number = 42.50

var sum = score1 + score2

console.log("名字: "+uname)

console.log("第一個科目成績: "+score1)

console.log("第二個科目成績: "+score2)

console.log("總成績: "+sum)復制

注意： 變量不要使用 name 否則會與 DOM 中的全局 window 對象下的 name 屬性出現了重名。

使用 tsc 命令編譯以上代碼，得到如下 JavaScript 代碼：

var uname = "Runoob"; var score1 = 50; var score2 = 42.50; var sum = score1 + score2; console.log("名字: " + uname); console.log("第一個科目成績: " + score1); console.log("第二個科目成績: " + score2); console.log("總成績: " + sum);

執行該 JavaScript 代碼輸出結果為：

名字: Runoob
第一個科目成績: 50
第二個科目成績: 42.5
總成績: 92.5

TypeScript 遵循強類型，如果將不同的類型賦值給變量會編譯錯誤，如下實例：

var num:number = "hello"     // 這個代碼會編譯錯誤

2、類型斷言（Type Assertion）

類型斷言可以用來手動指定一個值的類型，即允許變量從一種類型更改為另一種類型。

語法格式：

< 類型 >值
或:

值 as 類型

實例

var str = '1' var str2:number = < number > < any > str //str、str2 是 string 類型 console.log(str2)復制

3、TypeScript 是怎么確定單個斷言是否足夠

當 S 類型是 T 類型的子集，或者 T 類型是 S 類型的子集時，S 能被成功斷言成 T。這是為了在進行類型斷言時提供額外的安全性，完全毫無根據的斷言是危險的，如果你想這么做，你可以使用 any。

它之所以不被稱為 類型轉換 ，是因為轉換通常意味著某種運行時的支持。但是，類型斷言純粹是一個編譯時語法，同時，它也是一種為編譯器提供關于如何分析代碼的方法。

編譯后，以上代碼會生成如下 JavaScript 代碼：

var str = '1'; var str2 = str; //str、str2 是 string 類型 console.log(str2);

執行輸出結果為：

1

4、類型推斷

當類型沒有給出時，TypeScript 編譯器利用類型推斷來推斷類型。

如果由于缺乏聲明而不能推斷出類型，那么它的類型被視作默認的動態 any 類型。

var num = 2; // 類型推斷為 number console.log("num 變量的值為 "+num); num = "12"; // 編譯錯誤 console.log(num);

• 第一行代碼聲明了變量 num 并=設置初始值為 2。 注意變量聲明沒有指定類型。因此，程序使用類型推斷來確定變量的數據類型，第一次賦值為 2，num 設置為 number 類型。
• 第三行代碼，當我們再次為變量設置字符串類型的值時，這時編譯會錯誤。因為變量已經設置為了 number 類型。

  error TS2322: Type '"12"' is not assignable to type 'number'.
  

5、變量作用域

變量作用域指定了變量定義的位置。

程序中變量的可用性由變量作用域決定。

TypeScript 有以下幾種作用域：

• 全局作用域 ? 全局變量定義在程序結構的外部，它可以在你代碼的任何位置使用。
• 類作用域 ? 這個變量也可以稱為 字段 。類變量聲明在一個類里頭，但在類的方法外面。 該變量可以通過類的對象來訪問。類變量也可以是靜態的，靜態的變量可以通過類名直接訪問。
• 局部作用域 ? 局部變量，局部變量只能在聲明它的一個代碼塊（如：方法）中使用。

以下實例說明了三種作用域的使用：

var global_num = 12 // 全局變量 class Numbers { num_val = 13; // 實例變量 static sval = 10; // 靜態變量 storeNum():void { var local_num = 14; // 局部變量 } } console.log("全局變量為: "+global_num) console.log(Numbers.sval) // 靜態變量 var obj = new Numbers(); console.log("實例變量: "+obj.num_val)

以上代碼使用 tsc 命令編譯為 JavaScript 代碼為：

var global_num = 12; // 全局變量 var Numbers = /** @class */ (function () { function Numbers() { this.num_val = 13; // 實例變量 } Numbers.prototype.storeNum = function () { var local_num = 14; // 局部變量 }; Numbers.sval = 10; // 靜態變量 return Numbers; }()); console.log("全局變量為: " + global_num); console.log(Numbers.sval); // 靜態變量 var obj = new Numbers(); console.log("實例變量: " + obj.num_val);復制

執行以上 JavaScript 代碼，輸出結果為：

全局變量為: 12
10
實例變量: 13

如果我們在方法外部調用局部變量 local_num，會報錯：

error TS2322: Could not find symbol 'local_num'.

審核編輯 黃宇