TypeScript入門-聲明與結構、函數
學習Angular 2 ， 《揭秘Angular 2》讀書筆記。Angular2 選擇 TypeScript 作為其官方最主要的構建語音，這意味著掌握 TypeScript 語音將更有利于高效地開發 Angular 應用。
聲明和結構
在TypeScript 中，支持var、let 和 const 這樣的聲明方式。
let 聲明
let 與 var 聲明變量的寫法類似，示例代碼如下：
let hello = "Hello Angular";
不同于var， let 聲明的變量旨在塊級作用域內有效，示例代碼如下：
function f(input: boolean) {
let a = 100;
if(input) {
let b = a + 1; // 運行正確
return b;
}
return b; // 錯誤， b沒有被定義
}
這里定義了兩個變量 a 和 b ，a 的作用域是在f()函數體內，而b是在if這個語句塊中。塊級作用域還有幾點需要注意的：
-
不能在它的聲明之前被讀取或賦值
-
在同樣的作用域中，let 不允許變量被重復聲明
還需要注意 let 聲明在下面兩種函數入參的對比：
function funA(x) {
let x = 100; // 報錯，x已經在函數入參聲明
}
// 增加了判斷條件組成的新的塊級作用域
function funB(condition, x) {
if(condition) {
let x = 100; // 運行正常
return x;
}
return x;
}
funB(false, 0); // 返回 0
funB(true, 0); // 返回 100
const 聲明
const 聲明與 let 聲明相似，它與 let 擁有相同的作用域規則，但 const 聲明的是常量，常量不能被 重新賦值 。但是如果定義的常量是 對象 ，對象里的屬性值是可以被重新賦值的。示例代碼如下：
const CAT_AGE = 9;
const cat = {
name: 'kitty',
age: CAT_AGE
}
// 錯誤
CAT_AGE = 10;
// 錯誤
cat = {
name: 'Danie',
age: CAT_AGE
}
cat.name = "Jason"; // 正確
解構
解構是ES6中一個重要特性。解構就是將聲明的一組變量與 相同結構 的數組或者對象的元素數值一一對應，并將變量相對應元素進行賦值。
在 TypeScript 中支持數組解構和對象解構。
數組解構
數據結構是最簡單的解構類型，示例代碼如下：
let input = [1, 2];
let [first, second] = input;
console.log(first); // 相當于 input[0]: 1;
console.log(second); // 相當于 input[1]: 2
// 也可作用于已聲明的變量：
[first, second] = [second, first]; // 變量變換
// 或作用于函數參數
function f([first, second] = [number, number]) {
console.log(first + second);
}
f([1, 2]); // 輸出 3
有時，我們會看到如 let[first, ...rest] 使用 “...” 這樣的語句，“...” 三個連續小數點表示的是展開操作符，用于創建可變長的參數列表，使用起來非常方便，示例代碼如下：
let [first, ...rest] = [1, 2, 3, 4];
console.log(first); // 輸出 1
console.log(rest); // 輸出 [2, 3, 4];
對象解構
對象解構讓我們的代碼更加簡潔，可讀性強，示例代碼如下：
let test = { x: 0, y: 10, z: 20 };
let {x, y, z} = test;
console.log(x, y, z); // 輸出 0, 10, 20
函數
函數定義
在TypeScript中支持函數聲明和函數表達式的寫法，示例代碼如下：
// 函數聲明寫法
function maxA(x: number, y: number): number {
return x > y? x : y;
}
// 函數表達式寫法
let maxB = function(x: number, y: number): number {
return x > y? x : y;
}
在上例中，參數類型和返回值類型這兩部分都會被檢查。在調用時，只做參數類型和個數的匹配，不做參數名的校驗。
可選參數
在 TypeScript 中，被調函數的每個參數都是 必傳 的，也就是說傳遞給函數的參數個數必須和函數定義時的參數一致，示例代碼如下：
function max(x: number, y: number): number {
return x > y? x: y;
}
let result1 = max(2); // 報錯
let result2 = max(2, 4); // 正常
但是，在現實開發中，我們需要根據實際情況來決定是否傳入某個參數的情況，TypeScript 也提供了可選參數語法，即在參數名旁邊加上 ？ 來使其變成可變參數，需要注意的是，可選參數必須位于必選參數的 后面 ，示例代碼如下：
function max(x: number, y?: number): number {
if(y) {
return x > y? x: y;
} else {
return x;
}
}
let result1 = max(2); // 正常
let result2 = max(2, 4); // 正常
let result3 = max(2, 4, 7); // 報錯
默認參數
TypeScript 還支持初始化默認參數，如果函數的某個參數設置了默認值，當該函數被調用時，如果沒有給這個參數傳值或者傳的值為 undefined 時，這個參數的值就是設置的默認值，示例代碼如下：
function max(x: number, y = 4): number {
return x > y? x: y;
}
let result1 = max(2); // 正常
let result2 = max(2, 4); // 正常
let result3 = max(2, undefined); // 正常
帶默認值的參數不必放在必選參數后面，但如果默認值參數放到了必選參數前面，用戶必選顯式地傳入 undefined , 示例代碼如下：
function max(x = 2, y: number): number {
return x > y? x: y;
}
let result1 = max(2); // 報錯
let result2 = max(undefined, 4); // 正常
let result3 = max(2, 4); // 正常
剩余參數
當我們需要同時操作多個參數，或者不知道會有多少個參數傳遞進來的時候，就需要用到 TypeScript 里的剩余參數。示例代碼如下：
function sum(x:number, ...restOfNumber:number[]): number {
// 是不是覺得...特別熟悉，就是上面說的展開操作符
let result = x;
for(let i = 0; i < restOfNumber.length; i++) {
result += restOfNumber[i];
}
return result;
}
let result = sum(1, 2, 3, 4, 5);
console.log(result); // 輸出 15
函數重載
函數重載是通過為同一個函數提供多個函數類型定義來達到實現多種功能的母的。TypeScript 可以支持函數的重載，示例代碼如下：
function css(config: {});
function css(config: string, value: string);
在上面的例子種，這個函數有2種重載方法，編譯器會根據參數類型來判斷該調用哪個函數。TypeScript 的函數重載通過查找重載列表來實現匹配，因此，在實現重載方法時，建議將最精確的定義放在最前面。
來自：https://segmentfault.com/a/1190000008909822