函数 Function
Typescript 文档地址：Functions
在JavaScript中，函数是构成任何应用程序的基础块。通过函数，你得以实现建立抽象层、模仿类、信息隐藏和模块化。在TypeScript中，虽然已经存在类和模块化，但是函数依旧在如何去"处理"事件的问题上起关键作用。TypeScript在JavaScript的标准基础上给函数添加了一些新的功能使使用者可以更好的用函数处理工作。
首先，和JavaScript一样，TypeScript中的函数可以创建命名函数和匿名函数。这样你就可以为应用程序选择最合适的方式，无论是定义一系列函数API还是一次性使用的函数。
小demo
// 来到我们的第一个例子，约定输入，约定输出 function add(x: number, y: number): number { return x + y } // 可选参数 function add(x: number, y: number, z?: number): number { if (typeof z === 'number') { return x + y + z } else { return x + y } } // 函数本身的类型 const add2: (x: number, y: number, z?:number) => number = add // interface 描述函数类型 const sum = (x: number, y: number) => { return x + y } interface ISum { (x: number, y: number): number } const sum2: ISum = sum 复制代码
函数类型
JavaScript的函数参数是可以任何类型的，typeScript中加了对参数提添加类型，函数本身添加返回值类型。
function greetNane(name: string): string { return `hello ${name}` } 复制代码
还有一种函数声明的方式：
let greetNane: (name: string) => string = function (name: string): string { return `hello ${name}` } 复制代码
typeScript中函数调用时传的参数类型和数量和函数声明时候不匹配会报错。
可选参数和默认参数
可选参数：typeScript中设置函数中一个参数可传也可不传的。
let greetNane: (name: string, age?: number) => string = function (name: string, age?: number): string { return `hello ${name}` } 复制代码
默认参数：和es6的默认参数写一样，也可以在参数后面加类型。
let greetNane: (name: string, age: number = 0) => string = function (name: string, age: number = 0): string { return `hello ${name} ${age}` } let greetNane: (name: string, age = 0) => string = function (name: string, age = 0): string { return `hello ${name} ${age}` } 复制代码
剩余参数
typeScript剩余参数和es6的写法差不多，也是后面加个参数的类型。
let greetNane: (name: string, ...arrs: string[]) => string = function (name: string, ...arrs: string[]): string { return `hello ${name} ${age}` } 复制代码
...的用法和es6的一样。
注：因为现在主流浏览器都没有完全支持es6，所有在实际项目中es6和typescript都是最后转换成es5的写法。剩余参数的转换成es5是遍历arguments参数将参数放到arrs数组中。
let arrs=[] for (var _i = 0, coumt = arguments.length; i < coumt; i++) { arrs[_i]=arguments[_i] } 复制代码
如果你认为这个可能对应用程序带来性能问题,应考虑不使用剩余参数只使用数组作为参数。
重载
函数重载或方法重载是名称相同并且参数数量类型不同创建多个方法的能力。
typeScript中通过声明函数标签，最后在一个标签实现函数的。
function greetNane(name:string) :string; function greetNane(name:number) :number; function greetNane(name:boolean) :boolean; function greetNane(name:(string|number|boolean)):any{ return name; } 复制代码
泛型
作用域，this，箭头函数就不说了，直接说泛型，泛型来创建可重用的组件，一个组件可以支持多种类型的数据。
function greetNane<T>(name:T):T{ return name } greetNane<string>('name') greetNane('name') 复制代码
函数根据参数的类型来返回对应类型的值。
