函数(function)分为署名函数(named function)和匿名函数(anonymous function)看代码
// named function
function sub(x,y){
console.log(x-y);
}
// anonymous function
var sub1 = function(x,y){
console.log(x-y);
}
完善上面的代码,增加类型相关信息
function sub(x: number, y: number): number{
return x-y;
}
var sub1 = function(x: number, y: number): number{
return x-y
}
让我们写出函数的完整类型,看上去是这样的,使用=>
符号连接参数类型与反回值类型,如果没有任何反回值时要记得添写void
.
var sub2: (x: number, y:number)=>number = function(x: number, y:number): number{
return x-y;
}
// 只要类型相匹配就可以,名称无关紧要,增加函数类型在我看来只是为了增加函数的可读性
var sub2: (source: number, dest:number)=>number = function(x: number, y:number): number{
return x-y;
}
在看下面的例子,TypeScript都能正确的判断出函数所对应的类型.
//右边指定类型,左边没有指定
var sub3 = function(x: number, y: number): number{
return x-y;
}
//左边指定类型,右边没有指定
var sub4: (x: number, y:number)=>number = function(x, y): number{
return x-y;
}
大家都知道.在JavaScript里函数的参数是可有可无的,而在TypeScript中每个参数都是必需的,即声明时需要传入两个参数,在使用时传入的参数个数必需是两个而且类型必需一致,否则在编译时就会抛出错误.
function twoParam(one: string, two: string):string{
return one + two;
}
twoParam('a','b');
twoParam('a'); //错误,参数数量不匹配
twoParam('a','b','c'); //错误,参数数量不匹配
如果就想在TypeScript中使用可选的参数,需要在不确定的参数后面加上?
符号,需要说明的是可选参数必需放到最后,例如:
function buildName(firstName: string, lastName?: string) {
if (lastName)
return firstName + " " + lastName;
else
return firstName;
}
var result1 = buildName("Bob"); //正确
var result2 = buildName("Bob", "Adams", "Sr."); //错误, 参数数量不匹配
var result3 = buildName("Bob", "Adams"); //正确
为可选参数指定一个默认值
function buildName(firstName: string, lastName = 'pope') {
// ...
}
如果我们不确定可选参数的个数
function buildName(firstName: string, ...restOfName: string[]) {
return firstName + " " + restOfName.join(" ");
}
var employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");
Lambda 和 this
在javascript中使用this是非常容易因为上下文不同,使用this时得出错误的结果.例如:
var myObj = {
name: 'weiqi',
say: function(str:string){
return function(){
console.log(this.name + ' ' + str);
}
}
}
var say = myObj.say('hello');
say(); // 输出为 undefined hello
可以看到this.name反回结果为undefined, 说明this没有绑定到myObj这个上下文中.如果改用Lambda写法的话,TypeScript会在编译时自动为我们绑定this到当前上下文中. 可以改造上个例子为:
var myObj = {
name: 'weiqi',
say: function(str:string){
return () => console.log(this.name + ' ' + str);
}
}
var say = myObj.say('hello');
say(); // 输出 weiqi hello
函数的重载
重载的好处为,在编写代码时由编译器负责检查传入参数类型及反回类型,使用时可以反回与传入参数类型相匹配的反回类型.看例子:
function add(arg1: string, arg2: string): string; //重载1
function add(arg1: number, arg2: number): number; //重载2
function add(arg1: boolean, arg2: boolean): boolean;//重载3
//这是对上面重载的实现
function add(arg1: any, arg2: any): any {
return arg1 + arg2;
}
//只能传入之前定义后的3种参数类型,如果传入其它组合类型则会得到一个错误
console.log(add(1, 2)); //反回类型为number
console.log(add("Hello", "World")); //反回类型为string
console.log(add(true, false)); //反回类型为boolean