带你读《现代TypeScript高级教程》三、函数(1)https://developer.aliyun.com/article/1348560?groupCode=tech_library
5.this和箭头函数
箭头函数可以保留函数创建时的 this值,而不是调用时的值。在TypeScript中,你可以使用箭头函数来确保this的值:
let deck = { suits: ["hearts", "spades", "clubs", "diamonds"], cards: Array(52), createCardPicker: function() { 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);
在上面的例子中,createCardPicker函数返回一个箭头函数,这个箭头函数可以访问创建时的this值。
6.重载
在JavaScript中,根据传入不同的参数调用同一个函数,返回不同类型的值是常见的情况。TypeScript通过为同一个函数提供多个函数类型定义来实现这个功能:
function reverse(x: number): number;function reverse(x: string): string;function reverse(x: number | string): number | string { if (typeof x === 'number') { return Number(x.toString().split('').reverse().join('')); } else if (typeof x === 'string') { return x.split('').reverse().join(''); }} reverse(12345); // returns 54321reverse('hello'); // returns 'olleh'
在上面的例子中,我们定义了两个重载:一个是接受number类型的参数,另一个是接受string类型的参数。然后我们在实现函数中处理了这两种情况。