Optional and Default Parameters
- 如果默認(rèn)參數(shù)被用作尾參數(shù)冀自，那么它起的作用和尾參數(shù)是可選的作用是一樣的：
function buildName(firstName: string, lastName?: string) {
// ...
}
function buildName(firstName: string, lastName = "Smith") {
// ...
}
(firstName: string, lastName?: string) => string
- 可選參數(shù)如果有咧纠，那么只能放在尾參數(shù)
- 默認(rèn)參數(shù)位置任意惠勒，其類型由默認(rèn)值決定双藕，也就是說(shuō)如果賦值了矫俺，那么值只能是設(shè)定的默認(rèn)值的類型或者
undefined
function buildName(firstName = "sss", lastName: string) {
return firstName + " " + lastName;
}
let result3 = buildName(undefined | string , "ssss");
console.log(result3);
Rest Parameters
-
...用于無(wú)窮個(gè)可選參數(shù)币励，用于類型里面定義rest參數(shù)
function buildName(firstName: string, ...restOfName: string[]) {
return firstName + " " + restOfName.join(" ");
}
let buildNameFun: (fname: string, ...rest: string[]) => string = buildName;
this
this是在函數(shù)調(diào)用時(shí)被設(shè)定的變量
let deck = {
suits: ["hearts", "spades", "clubs", "diamonds"],
cards: Array(52),
createCardPicker: function() {
return function() {
let pickedCard = Math.floor(Math.random() * 52);
let pickedSuit = Math.floor(pickedCard / 13);
return {suit: this.suits[pickedSuit], card: pickedCard % 13};
}
}
}
let cardPicker = deck.createCardPicker();
let pickedCard = cardPicker();
//出錯(cuò)慷蠕，this.suits[pickedSuit] this被綁定到了 window | undefined
alert("card: " + pickedCard.card + " of " + pickedCard.suit);
this和arrow function
- 通過(guò)使用
arrow function綁定函數(shù)的上下文 - 可以通過(guò)執(zhí)行加上
--noImplicitThis來(lái)幫助提醒可能存在的綁定上下文錯(cuò)誤
let deck = {
suits: ["hearts", "spades", "clubs", "diamonds"],
cards: Array(52),
createCardPicker: function() {
// NOTE: the line below is now an arrow function, allowing us to capture 'this' right here
return () => {
let pickedCard = Math.floor(Math.random() * 52);
let pickedSuit = Math.floor(pickedCard / 13);
return {suit: this.suits[pickedSuit], card: pickedCard % 13};
}
}
}
let cardPicker = deck.createCardPicker();
let pickedCard = cardPicker();
alert("card: " + pickedCard.card + " of " + pickedCard.suit);
this parameter
- 然而，即使
arrow function綁定了上下文,但是食呻，this.suits[pickedSuit]的類型依然是any,因?yàn)?code>this來(lái)源于對(duì)象字面量?jī)?nèi)部的函數(shù)表達(dá)式 - 所以TypeScript提供一個(gè)
this parameter來(lái)修復(fù)這個(gè)bug
interface Card {
suit: string;
card: number;
}
interface Deck {
suits: string[];
cards: number[];
createCardPicker(this: Deck): () => Card;
}
let deck: Deck = {
suits: ["hearts", "spades", "clubs", "diamonds"],
cards: Array(52),
// NOTE: The function now explicitly specifies that its callee must be of type Deck
createCardPicker: function(this: Deck) {
return () => {
let pickedCard = Math.floor(Math.random() * 52);
let pickedSuit = Math.floor(pickedCard / 13);
return {suit: this.suits[pickedSuit], card: pickedCard % 13};
}
}
}
let cardPicker = deck.createCardPicker();
let pickedCard = cardPicker();
alert("card: " + pickedCard.card + " of " + pickedCard.suit);
這樣就修復(fù)了bug流炕，TypeScript知道了this的類型是Deck，就沒(méi)有any錯(cuò)誤了
- this parameter in callbacks
當(dāng)函數(shù)作為參數(shù)傳入一個(gè)一個(gè)庫(kù)中的函數(shù)中的時(shí)候仅胞，這些庫(kù)會(huì)把傳入的函數(shù)當(dāng)做普通的函數(shù)處理每辟，因此這個(gè)函數(shù)捕獲的this會(huì)變成undefined，所以在這個(gè)函數(shù)內(nèi)涉及到this的會(huì)報(bào)錯(cuò)干旧。
通過(guò)以下幾步解決錯(cuò)誤渠欺，而且可以使用this - 首先通過(guò)
fake parameter this，確保傳入的參數(shù)函數(shù)是不會(huì)捕獲this椎眯，第一層檢查挠将。
interface UIElement {
addClickListener(onclick: (this: void, e: Event) => void): void;
}
- 然后通過(guò)箭頭函數(shù)來(lái)幫忙
class Handler {
info: string;
onClickGood = (e: Event) => { this.info = e.message }
}
以上可以會(huì)有缺點(diǎn)胳岂。那就是每次傳建一個(gè)Handler類型的對(duì)象都會(huì)創(chuàng)建一個(gè)新的arrow function，造成浪費(fèi)捐名，解決辦法是在Handler的原型上創(chuàng)建公用的方法
Overloads
JavaScript函數(shù)對(duì)于不同的參數(shù)可能返回不同類型的對(duì)象等等旦万，所以需要如下措施來(lái)幫助做type-check
- 通過(guò)
overloads和調(diào)用函數(shù)相同名字的函數(shù)組，來(lái)檢查每一個(gè)可能產(chǎn)生的結(jié)果镶蹋。
let suits = ["hearts", "spades", "clubs", "diamonds"];
function pickCard(x: {suit: string; card: number; }[]): number;
function pickCard(x: number): {suit: string; card: number; };
function pickCard(x): any {
// Check to see if we're working with an object/array
// if so, they gave us the deck and we'll pick the card
if (typeof x == "object") {
let pickedCard = Math.floor(Math.random() * x.length);
return pickedCard;
}
// Otherwise just let them pick the card
else if (typeof x == "number") {
let pickedSuit = Math.floor(x / 13);
return { suit: suits[pickedSuit], card: x % 13 };
}
}
let myDeck = [{ suit: "diamonds", card: 2 }, { suit: "spades", card: 10 }, { suit: "hearts", card: 4 }];
let pickedCard1 = myDeck[pickCard(myDeck)];
alert("card: " + pickedCard1.card + " of " + pickedCard1.suit);
let pickedCard2 = pickCard(15);
alert("card: " + pickedCard2.card + " of " + pickedCard2.suit);
