TypeScript学习笔记(三) - 方法

本篇将介绍在TypeScript里如何定义和使用方法。

一、方法标准声明和使用

1 // 方法声明
2 function func(x: number, y: number): number {
3     return x + y;
4 }

在TypeScript里,方法声明可以明确定义每一个参数的类型,和返回值的类型。在编译时,编译器会检查方法体的返回值类型是否符合定义的类型,同时在调用的时候也会检查传入的参数类型是否符合定义的类型,参数个数是否符合定义的个数。

1 let result1 = func(1, 2);                     // 正确的调用方式。
2 let result2 = func_lambda(1, 2, 3);           // 错误的调用方式。参数个数多余定义。
3 let result3 = func_lambda(1);                 // 错误的调用方式。参数个数少于定义。
4 let result4 = func_lambda('1', '2');          // 错误的调用方式。参数类型不符合定义。

另外,方法声明也支持使用Lambda表达式。

1 // lambda表达式声明
2 let func_lambda: (x: number, y: number) => number = function (x, y) { return x + y };

 

二、缺省参数声明

在某些情况下,方法调用只需要传入部分参数。TypeScript也支持缺省参数的声明方式。

复制代码
 1 // 缺省参数定义
 2 let showName = function (firstName: string, lastName?: string): string {
 3     if (lastName) {
 4         return firstName + ' ' + lastName;
 5     } else {
 6         return firstName;
 7     }
 8 };
 9 
10 let wholeName1 = showName('星辰', 'Lee');
11 let wholeName2 = showName('星辰');
复制代码

通过在参数名称后面加上?,标识该参数是缺省的,调用时如果对应参数位置不传入,对应参数位置则为undefined。

 

三、默认值参数声明

在某些情况下,方法调用时某些参数在不传入时,默认使用方法定义的值。TypeScript同样支持默认值参数的声明方式。

1 // 默认值参数定义
2 let showName2 = function (firstName: string, lastName = 'Lee'): string {
3     return firstName + ' ' + lastName;
4 };
5 
6 let wholeName3 = showName2('星辰');

通过在参数名称后加上=号并赋值,标识该参数具有默认值。调用时如果对应参数位置不传入或者传入undefined,则取默认值,否则取对应位置传入的值。

 

四、多参数声明

像其他强类型语言一样,TypeScript在定义方法的时候,也支持不明数量的多参数传入。

1 // 多参数定义
2 let restParamsFunc = function (param1: string, ...restParams: string[]): string {
3     return param1 + ' ' + restParams.join(' ');
4 };
5 
6 let resParamsFuncResult = restParamsFunc('a', 'b', 'c');

通过在参入名称前加上...(三个小数点),标识对应位置的参数可以传入多个。因为参数类型已明确定义,所以传入的多个参数的类型必须与定义保持一致,否则编译时将提示错误。

 

五、其他类型参数声明

对象类型:

复制代码
 1 // 对象类型参数
 2 let jsonParamFunc = function (x: { p1: string }): string {
 3     return x.p1;
 4 };
 5 
 6 let jsonParamFuncResult1 = jsonParamFunc({ p1: 'a' });              // 赋值类型正确
 7 let jsonParamFuncResult2 = jsonParamFunc({ p1: 'a', p2: 'b' });     // 赋值类型错误,参数属性比定义的多。
 8 let jsonParamFuncResult3 = jsonParamFunc({ p3: 'c' });              // 复制类型错误,参数属性名不匹配。
 9 let params = { p1: 'a', p2: 'b' };
10 let jsonParamFuncResult4 = jsonParamFunc(params);                   // 用变量代替直接复制,编译器检查通过。
复制代码

上面的例子里,参数类型被定义为一个拥有属性“p1”的json对象。在方法调用时,传入的参数将严格符合参数类型的定义,参数对象的属性多余或者少于定义将提示错误,属性名称与定义不一致也将提示错误。

但是,如果传入的是一个变量,变量的属性只要能满足定义的类型属性即可。

方法类型:

复制代码
1 // 方法类型参数
2 let funcParamFunc = function (func: (x: string, y: string) => string): string {
3     let _x = 'a';
4     let _y = 'b';
5     return func(_x, _y);
6 };
7 
8 let funParamFuncResult = funcParamFunc(function (x, y) { return x + y });
复制代码

方法参数类型可定义为一个固定结构的方法,该方法就成为了一个回调方法。

 

六、方法重载

TypeScript也支持方法重载。

复制代码
 1 // 方法重载
 2 function overloadFunc(x: { p1: string }): string;
 3 function overloadFunc(x: number): number;
 4 function overloadFunc(x): any {
 5     if (typeof x == 'object') {
 6         return x.p1;
 7     }
 8 
 9     if (typeof x == 'number') {
10         return x;
11     }
12 }
13 
14 let overloadFuncResult1 = overloadFunc({ p1: 'a' });
15 let overloadFuncResult2 = overloadFunc(1);
复制代码

在上面的例子里,连续声明了拥有同一个名称的三个方法:

前两个方法只有方法定义,没有方法体。它们定义了重载方法的个数和表现形式。

最后一个方法的参数没有定义类型,返回值定义为any,同时有方法体。它定义了重载方法的具体实现。

 

最后,将以上代码编译过后的JavaScript代码展示出来,可以进行对比。

// 方法声明
function func(x, y) {
    return x + y;
}
var result1 = func(1, 2); // 正确的调用方式。
var result2 = func_lambda(1, 2, 3); // 错误的调用方式。参数个数多余定义。
var result3 = func_lambda(1); // 错误的调用方式。参数个数少于定义。
var result4 = func_lambda('1', '2'); // 错误的调用方式。参数类型不符合定义。
// lambda表达式声明
var func_lambda = function (x, y) { return x + y; };
// 缺省参数定义
var showName = function (firstName, lastName) {
    if (lastName) {
        return firstName + ' ' + lastName;
    }
    else {
        return firstName;
    }
};
var wholeName1 = showName('星辰', 'Lee');
var wholeName2 = showName('星辰');
// 默认值参数定义
var showName2 = function (firstName, lastName) {
    if (lastName === void 0) { lastName = 'Lee'; }
    return firstName + ' ' + lastName;
};
var wholeName3 = showName2('星辰');
// 多参数定义
var restParamsFunc = function (param1) {
    var restParams = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        restParams[_i - 1] = arguments[_i];
    }
    return param1 + ' ' + restParams.join(' ');
};
var resParamsFuncResult = restParamsFunc('a', 'b', 'c');
// 对象类型参数
var jsonParamFunc = function (x) {
    return x.p1;
};
var jsonParamFuncResult1 = jsonParamFunc({ p1: 'a' }); // 赋值类型正确
var jsonParamFuncResult2 = jsonParamFunc({ p1: 'a', p2: 'b' }); // 赋值类型错误,参数属性比定义的多。
var jsonParamFuncResult3 = jsonParamFunc({ p3: 'c' }); // 复制类型错误,参数属性名不匹配。
var params = { p1: 'a', p2: 'b' };
var jsonParamFuncResult4 = jsonParamFunc(params); // 用变量代替直接复制,编译器检查通过。
// 方法类型参数
var funcParamFunc = function (func) {
    var _x = 'a';
    var _y = 'b';
    return func(_x, _y);
};
var funParamFuncResult = funcParamFunc(function (x, y) { return x + y; });
function overloadFunc(x) {
    if (typeof x == 'object') {
        return x.p1;
    }
    if (typeof x == 'number') {
        return x;
    }
}
var overloadFuncResult1 = overloadFunc({ p1: 'a' });
var overloadFuncResult2 = overloadFunc(1);

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值