TypeScript基础-函数

南山隐士 2022年06月25日 29 0

函数定义

函数声明法

function showName():string {
  return 'yaojin'
}

上面定义的函数必须要返回字符串的数据

匿名函数

var fun = function():string {
  return 'yaojin'
}
alert(fun())

==typescript中的函数必须定义返回值类型,如果函数没有返回值,你也必须指定以void而不能为空==

函数中传参

普通传参

function getInfo(name:string,age:number):string{
  return `${name} --- ${age}`;
}

==typescript中形参需要指定类型, 并且实参不可以大于形参==

可选参数
在以前实参和形参的个数可以不一样,如果我们想实参少于形参,那么就需要定义可选参数

function getInfo(name:string,age?:number):string{
  if(age) {
      return `${name} --- ${age}`;
  } else {
      return `${name} ---年龄保密`;
  }
}
alert(getInfo('zhangsan'))
alert(getInfo('zhangsan',123))

在参数名称后面加上 ? 就可以定义一个可选参数,该参数你可以选择性的传入,需要注意的是,==可选参数必须定义到最后==

默认参数
跟 es6 一样,typescript也可以定义默认参数,该参数你也可以选择性的传入

function getInfo(name:string,age:number = 20):string{
  if(age) {
    return `${name} --- ${age}`;
  } else {
    return `${name} ---年龄保密`;
  }
} 

// alert( getInfo('张三')); // 张三---20
alert( getInfo('张三',30));

==如果默认参数在必须参数前面,那么就需要必须使用undefined来获得默认值==

function buildName(firstName = "Will", lastName: string) {
    return firstName + " " + lastName;
}
let result4 = buildName(undefined, "Adams"); 

可以说, 默认参数也属于可选参数, 不同之处在于,它设置了一个默认值, 并且这个参数不一定要定义在最后面

剩余参数
在以前,我们可以使用 arguments来访问所有传入的参数,在typescript中你可以
==把所有参数收集到一个变量里==

function sum(a:number,b:number,...result:number[]):number{                
  var sum = a + b;
  for(var i=0; i<result.length; i++){
    sum+=result[i];  
  }
  return sum;
}
alert(sum(1,2,3,4,5,6)) ;

this

typescript中,我们也可以对函数的this指向进行类型的检查

class thisClass {
  name?: string;
  test(this:thisClass) {
    console.log(this)
  }
}

let thisTest = new thisClass()
thisTest.test(); // 可以调用, 因为此时this指向thisClass实例

function test(this: thisClass) {
  console.log(this)
}
// test() // 错误, 此时this指向window,而this的类型需要是thisClass

重载

重载指的是通过为同一个函数提供多个函数类型定义

function getInfo(name:string):string;
function getInfo(name:string,age:number):string;
function getInfo(name:any,age?:any):any{
    if(age){

        return '我叫:'+name+'我的年龄是'+age;
    }else{

        return '我叫:'+name;
    } 
}

alert(getInfo('zhangsan'));  /*正确*/

// alert(getInfo(123));  //错误

像上面的代码,会优先使用只有一个参数,并且类型为string的参数,否则就会使用第二个规则, 注意最后any函数并不属于重载的一部分, 可以理解为重载为了让函数可以接受不同的类型不同数量的参数,而返回不一样的数据的方法

Last Updated: 2022/06/25 19:14:52
TypeScript基础-数据类型 TypeScript基础 -类