TypeScript學習筆記（二） - 基本類型

本篇將簡單介紹TypeScript的幾種基本類型。

TypeScript基本類型有以下幾種：

• • Boolean
  • Number
  • String
  • Array
  • Tuple
  • Enum
  • Any

另外還有void類型，主要用於標識方法返回值的類型。

下面經過一些簡單的例子來展現這些類型的基本用法

 1 // Boolean
 2 let isDone: boolean = false;
 3 isDone = true;
 4 
 5 // Number
 6 let num: number = 1;        // 整數
 7 num = 2.5;                  // 小數
 8 num = 0xf00d;               // 十六進制
 9 num = 0b0101;               // 二進制
10 num = 0o123;                // 八進制
11 
12 // String
13 let str: string = 'Hello world';
14 let content: string = `${str} too`;                 // 使用表達式拼接字符串時，須要使用(`)符號將拼接內容包括起來
15 
16 // Array
17 let numbers1: number[] = [1, 2];
18 let numbers2: Array<number> = [1, 2, 3];            // 另一種定義數組類型的方式，與nunber[]等價
19 
20 // Tuple（元組類型）
21 let t: [string, number] = ['No.', 1];
22 t = ['This is No.', 2];                             // 值類型與定義的一致，編譯經過。
23 //t = [2, 'This is No.'];                           // 值類型與定義的不一致，編譯失敗，提示錯誤。
24 
25 // Enum（枚舉）
26 enum Operator1 { Add, Update, Delete, Select };
27 let opt1: Operator1 = Operator1.Add;                // opt1的值爲0。取枚舉項的默認值。
28 
29 enum Operator2 { Add = 1, Update, Delete, Select };
30 let opt2: Operator2 = Operator2.Update;             // opt2的值爲2。當某一項設置了值後，後續項的值都順次加1。
31 let opt2Name: string = Operator2[2];                // opt2Name的值爲Update。經過值索引能夠獲得枚舉項的名稱。

以上類型的聲明都是強類型聲明，也就是說對已經指定了明確類型的變量賦值另外類型的值時，某些IDE（VS 201五、VS Code和WebStorm）會在對應行顯示錯誤標識。同時在編譯時會提示編譯錯誤，相似效果以下：

另外，Any類型是一個特殊的類型。它表示當前對象的類型由具體的值的類型來肯定，它能夠適用於任何強類型。

1 // Any
2 let obj: any = 'This is a string.';
3 obj = 1;
4 obj = [1, 2];
5 obj = false;
6 obj = {};
7 obj = function () { return false; };

Any類型的值能夠經過強制類型轉換將值轉換成目標類型

1 // 強制類型轉換
2 let obj1: any = 'This is a string.';
3 let len: number = (<string>obj1).length;
4 len = (obj1 as string).length;

將以上代碼進行編譯後將轉換成ES5標準的JavaScript源碼，以下

 1 // Boolean
 2 var isDone = false;
 3 isDone = true;
 4 // Number
 5 var num = 1;        // 整數
 6 num = 2.5;          // 小數
 7 num = 0xf00d;       // 十六進制
 8 num = 5;            // 二進制
 9 num = 83;           // 八進制
10 // String
11 var str = 'Hello world';
12 var content = str + " too";                             // 使用表達式拼接字符串時，須要使用(`)符號將拼接內容包括起來
13 // Array
14 var numbers1 = [1, 2];
15 var numbers2 = [1, 2, 3];                               // 另一種定義數組類型的方式，與nunber[]等價
16 // Tuple（元組類型）
17 var t = ['No.', 1];
18 t = ['This is No.', 2];                                 // 值類型與定義的一致，編譯經過。
19 //t = [2, 'This is No.'];                               // 值類型與定義的不一致，編譯失敗，提示錯誤。
20 // Enum（枚舉）
21 var Operator1;
22 (function (Operator1) {
23     Operator1[Operator1["Add"] = 0] = "Add";
24     Operator1[Operator1["Update"] = 1] = "Update";
25     Operator1[Operator1["Delete"] = 2] = "Delete";
26     Operator1[Operator1["Select"] = 3] = "Select";
27 })(Operator1 || (Operator1 = {}));
28 ;
29 var opt1 = Operator1.Add;                               // opt1的值爲0。取枚舉項的默認值。
30 var Operator2;
31 (function (Operator2) {
32     Operator2[Operator2["Add"] = 1] = "Add";
33     Operator2[Operator2["Update"] = 2] = "Update";
34     Operator2[Operator2["Delete"] = 3] = "Delete";
35     Operator2[Operator2["Select"] = 4] = "Select";
36 })(Operator2 || (Operator2 = {}));
37 ;
38 var opt2 = Operator2.Update;                            // opt2的值爲2。當某一項設置了值後，後續項的值都順次加1。
39 var opt2Name = Operator2[2];                            // opt2Name的值爲Update。經過值索引能夠獲得枚舉項的名稱。
40 // Any
41 var obj = 'This is a string.';
42 obj = 1;
43 obj = [1, 2];
44 obj = false;
45 obj = {};
46 obj = function () { return false; };
47 // 強制類型轉換
48 var obj1 = 'This is a string.';
49 var len = obj1.length;
50 len = obj1.length;

 

其餘相關內容

在新的ECMAScript 2015標準裏，爲了解決變量提高，簡化塊級做用域的實現方式，對變量的聲明增長了兩個關鍵詞：let和const。

• • const：常量。一旦聲明賦值後，將不能對此變量進行再次賦值。
  • let：塊級做用域變量。變量的生命週期只在被{}括號包裹的代碼範圍內有效，且不能重複聲明。

在新的標準下編寫JavaScript代碼時，要遵循「多let少var」的規範。