TypeScript函数的基本使用
目录
1.TypeScript函数的基本使用
匿名函数
有名函数|命名函数|普通函数
箭头函数
接口函数
2.函数参数的处理
可选参数
参数的默认值
函数的剩余参数
3.构造函数
4.函数重载
参数类型不同：
参数数量不同：
参数类型顺序不同：
1.TypeScript函数的基本使用
- 介绍
- 函数是JavaScript应用程序的基础。它帮助你实现抽象层，模拟类，信息隐藏和模块。在TypeScript里，虽然已经支持类，命名空间和模块，但函数仍然是主要的定义行为的地方。TypeScript为JavaScript函数添加了额外的功能，让我们可以更容易地使用
- 函数定义的方式
匿名函数
const makeMoney = function(salary:number,reward:bumber):number{
return salary+reward;
}有名函数|命名函数|普通函数
//关键字 变量名(参数:数据类型,参数:数据类型):数据类型
function writeCode(hour:number,sleep:number):number{
//返回 值
return hour
}箭头函数
const seeMeiMei = (time:number):void =>{
console.log(`我每天要看${time}个小时MeiMei`);
}
seeMeiMei(6)接口函数
// 接口函数,利用type声明一个函数
type myFunc = (x:number,y:number)=> number
// 函数具体实现
const relFunc:myFunc=(a:number,b:number)=> {
return a+b;
}
relFunc(10,20)
let res = relFunc(10,20)
console.log(res)2.函数参数的处理
- 可选参数:
在TypeScript 函数里，如果我们定义了参数，则我们必须传入这些参数，除非将这些参数设置为可选，可选参数使用问号标识?
- 默认参数:
我们也可以设置参数的默认值，这样在调用函数的时候，如果不传入该参数的值，则使用默认参数，语法格式为
function function_name(paraml[:type],param2[:type] = default_value){
}
- 剩余参数:
有一种情况，我们不知道要向函数传入多少个参数，这时候我们就可以使用剩余参数来定义。剩余参数语法允许我们将一个不确定数量的参数作为一个数组传入。...args :any[]
可选参数
// 可选参数
const func1:(a:number,b:number)=>number=(x:number,y:number)=>{
return x;
}
const func2 = function(a:number,b?:number):number{
return a;
}
func2(10)
func2(10,20)
func2(10,undefined)参数的默认值
//参数的默认值
const func3=function(x:number=100,y:number=200,z:number=300){
return x+y+z;
}
let res = func3(100,200)
console.log(res) //输出600
let res =func3(100,200,500)
console.log(res) //输出800（）函数的剩余参数
//函数的剩余参数
const func4 = function(...args:any[]){
console.log(args)
}
func4(10,20,30,"杨超越")
const func5 = function(a:number,b:string,...args:any[]){
console.log(a);
console.log(b);
console.log(args);
}
func5(100,"杨超越","女明星",22)3.构造函数
TypeScript 也支持使用JavaScript 内置的构造函数Function()来定义函数:
语法格式如下:
var res = new Function ([arg1[,arg2[,...argN]],]functionBody)
参数说明：
- arg1,arg2,...argN : 参考列表
- functionBody: 一个含有包括函数的JavaScript语句的字符串
//构造函数
//new 实例化
var myFunction=new Function("a","b","return a*b");
var res = myFunction(10,20)
console.log(res)4.函数重载
重载是方法名字相同，而参数不同，返回类型可以相同也可以不同。
每个重载的方法（或者构造函数）都必须有一个独一无二的参数类型列表。
参数类型不同：
function disp(string):void
function disp(number):void参数数量不同：
function disp(n1:number):void
function disp(x:number,y:number):void参数类型顺序不同：
function disp(n1:number,s1:string):void
function disp(s:string,n:number):void- 如果参数类型不同，则参数类型应设置为any。
- 参数数量不同你可以将不同的参数设置为可选。
export default{}
//不使用函数重载的问题
function add(a:number,b:number){
return a+b;
}
add(10,20)
//定义函数重载
//关键字 变量名(参数:数据类型,参数:数据类型):返回数据类型
function addFunc(a:number,b:number):number;
function addFunc(a:string,b:string):string;
function addFunc(a:string,b:number):string;
function addFunc(a:number,b:string):string;
//使用函数重载
function addFunc(a:any,b:any):any{
return a+b;
}
addFunc(10,20);
addFunc("杨超越","女")
addFunc("欧阳娜娜",25)
addFunc(25,"关晓彤")
//定义参数类型与参数数量不同
function star(s1:string):void;
function star(n1:number,s1:string):void;
function star(x:any,y?:any):any{
console.log(x);
console.log(y)
}
star("杨超越")
star(20,"ღ( ´･ᴗ･` )比心")