函数是 JavaScript 应用程序的基础。 它帮助你实现抽象层，模拟类，信息隐藏和模块。 在 TypeScript 里，虽然已经支持类，命名空间和模块，但函数仍然是主要的定义行为的地方。 TypeScript 为 JavaScript 函数添加了额外的功能，让你可以更容易地使用。
为函数定义类型
一般使用中，我们可以不必完整写出函数类型，因为 TypeScript 会为我们自动推断出类型，需要注意的是：类型中的参数名称可以不必和值中的参数名称匹配，只要它们类型是兼容的便可。
// 书写完成函数类型
let square: (x: number, y: number) => number;
square = function (width: number, height: number): number {
return width * height;
}
console.log(square(5, 6)); // 30
可选参数
参数名后面接一个 ?，该参数便成为了可选参数，需要注意是：可选参数必须跟在必须参数后面
let square: (x: number, y: number, s?: number) => number;
square = function (width: number, height: number, scale?: number): number {
if(scale) {
return width * height * scale;
} else {
return width * height;
}
}
console.log(square(5, 6)); // 30
console.log(square(5, 6, 2)); // 60
默认参数
当用户没有给一个参数传递值或者传递的值是 undefined 时，这个参数叫做可以有默认值的参数，我们可以使用 = 指定这种情况下的取值，在所有的必须参数后面带默认值的参数都是可选的，与可选参数一样，在调用函数的时候是可以省略的，但是有默认值的参数不一定要放在必须参数的后面，也可以放在前面，当传入 undefined 的时候，就会取默认参数指定的默认值。
function square(width = 6, height = 6, scale: number, cut = 10): number {
return width * height * scale - cut;
}
square(5, undefined, 2); // 5 * 6 * 2 - 10 = 50
剩余参数
与 ES6 一样，TypeScript 也支持剩余参数。
function max(a: number, b: number, ...resArr: number[]): number {
return Math.max(a, b, ...resArr);
}
console.log(max(10, 5, 6, 100, 200)); // 200
this 问题
在 TypeScript 中，可以在第一个参数里指定 this 的类型，虽然 this 在方法第一个参数的位置，但是它的作用实际上只是限定 this 的类型，并不是让我们作为第一个参数传值
class Person {
constructor(public name: string, public age: number) {
}
show(this: Person, doing: string) {
console.log(`${this.name} is ${this.age}, now is ${doing}`);
}
}
let me = new Person('funlee', 18);
me.show('Coding'); // funlee is 18, now is Coding
可以对回调函数里的 this 类型做限定：
interface UIElement {
addClickListener(onclick: (this: void, e: Event) => void): void
}
其中，this: void 表示 addClickListener 期望 onclick 回调函数不需要指定 this 的类型。那么限定了 this 类型后，会有什么效果呢？看如下例子：
class Handler {
info: string;
onClickBad(this: Handler, e: Event) {
this.info = e.message;
}
}
const h = new Handler();
uiElement.addClickListener(h.onClickBad); // 报错，因为this类型不匹配
// 修复报错：变更this类型
class Handler {
info: string;
onClickBad(this: void, e: Event) {
this.info = e.message;
}
}
const h = new Handler();
uiElement.addClickListener(h.onClickBad);
重载
TypeScript 允许我们定义多个函数类型定义来进行函数重载，编译器会根据定义列表去处理函数的调用。
function foo(x: number): string
function foo(x: string): string
function foo(x): any {
if (typeof x === 'number') {
return `${x} is a number`;
} else if (typeof x === 'string') {
return `${x} is a string`;
}
}
console.log(foo(123)); // 输出：123 is a number
console.log(foo('123')); // 输出：'123' is a string
