2.2-函数类型

Create by fall on 2021-11-14 Recently revised in 2022-02-22

函数类型

函数类型的声明

// 对传入参数的朱姐，对返回值的注解
function sum(x:number,y:number):number{
  return x+y
}
let sum2 = (x:number,y:number):number=>0
// 参数可选：最后一个可选参数之后，不能出现必填参数
function sum(x:number,y?:number):number{
  return x+(y||1)
}
// 参数默认值
function fullName(firstName:string ,secondName:string = '林枫'){
  return firstName + ' '+ secondName
}

定义接口类型

接口定义函数类型

interface SumFun {
	(num1:number,num2:number):number
}
// 使用函数类型
const add:SumFun = function(a,b){
  return a + b
}
add(12,23)

类型声明定义函数

type Inter = {
  (a:number):number
}
const inter:Inter = (number)=>number+'ICU'
inter(996)

剩余参数

// 剩余参数存放在 ... 后面即可捕获剩余参数
function createArr(a:number,...items:number[]){
  let result:number[] = []
  items.forEach(item=>{
    result.push(item)
  })
  return result
}
const arr = createArr(888,666,999,1314)
console.log(arr)

实例化

// 实例化只需要在前面添加 new 关键字即可
interface CallMeWithNewToGetString {
  new (): string;
}

// 使用
declare const Foo: CallMeWithNewToGetString;
const bar = new Foo(); // bar 被推断为 string 类型

函数重载

函数重载（方法重载）是使用相同名称和不同参数数量或类型创建多个方法的一种能力。 方法就是为同一个函数提供多个函数类型定义来进行函数重载，编译器会根据这个列表去处理函数的调用。

比如说，以下方法，使用时会出现问题。

// result.split 会报错，表明类型 number上不能使用 split
type Combinable = string | number;
function add(a: Combinable, b: Combinable) {
  if (typeof a === 'string' || typeof b === 'string') {
   return a.toString() + b.toString();
  }
  return a + b;
}
const result = add('Semlinker', ' Kakuqo');
result.split(' ');

可以使用函数重载去解决这个问题

type Combinable = string | number;
function add(x:number,y:number);
function add(x:string,y:string)
function add(a: Combinable, b: Combinable) {
  if (typeof a === 'string' || typeof b === 'string') {
   return a.toString() + b.toString();
  }
  return a + b;
}
const result = add('Semlinker', ' Kakuqo');
result.split(' ');

函数

函数的基本使用方法

// js的函数书写方法
function add(x, y) {
  return x + y
}
let sum = function (x, y) {
  return x + y
}
let plus = (x: string, y) => {
  return x + y
}
// ts 的函数的书写方法
let keke = (y: string): string => {
  console.log('咳咳' + y)
  return ''
}
keke('fake')

函数的泛型

泛型详情可见 3.2-泛型

泛型意思是，可以等到需要传入值的时候，这时候再限定参数将所需要的类型传入，达到限制类型的目的

function random<T>(arg:T):T{
  return arg
}
// 首先是 <T> 在调用函数时使用，T 将会被传入的类型取代。
random<string>('22')
random<number>(333)
// 就像传入参数一样，传入类型，然后调用类型

一般来讲会有几个约定俗成的名称

• K：顾名思义，对象中的键
• V：顾名思义，对象中的值
• T：一般的类型 Type
• E：元素类型 Element

可以进行省略类型的填写

funtion random<T,U>(key:T,value:U):U{
  console.log(key)
  return value
}
random(13,'哇塞')