TypeScript——函数

泊一

已于 2023-06-22 14:42:12 修改

阅读量395

点赞数

分类专栏： TypeScript 文章标签： typescript javascript 前端

于 2023-06-22 14:37:32 首次发布

本文链接：https://blog.csdn.net/w_D_lufei/article/details/131329339

版权

TypeScript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文介绍了TypeScript中如何为函数定义类型，包括基本类型如number和string，以及对象类型如User接口。还讨论了默认参数、可选参数的用法，并展示了剩余参数（rest参数）在函数中的应用。最后，通过函数重载的例子说明了如何根据不同参数实现不同功能。

摘要由CSDN通过智能技术生成

为函数定义类型

基本类型

function add(x: number, y: number): number {
    return x + y;
}

let myAdd = function(x: number, y: number): number { return x + y; };

对象类型

interface User {
	name: string,
	age: number
}

function add(user:User) {
	return user
}

console.log({name:'zs',age:18})

默认参数

在TypeScript里，我们也可以为参数提供一个默认值当用户没有传递这个参数或传递的值是undefined时。它们叫做有默认初始化值的参数。

function buildName(firstName: string, lastName = "Smith") {
    return firstName + " " + lastName;
}

let result1 = buildName("Bob");                 
// "Bob Smith"
let result2 = buildName("Bob", undefined);      
// "Bob Smith"
let result3 = buildName("Bob", "Adams", "Sr.");  
// error, too many parameters
let result4 = buildName("Bob", "Adams");         
// "Bob Adams"

可选参数

在TypeScript里我们可以在参数名旁使用 ?实现可选参数的功能,可选参数必须跟在必须参数后面

function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}

let result1 = buildName("Bob");  
// "Bob"
let result2 = buildName("Bob", "Adams", "Sr.");  
// error, too many parameters
let result3 = buildName("Bob", "Adams");  
//  "Bob Adams"

剩余参数

ES6 中，可以使用 …rest 的方式获取函数中的剩余参数（rest 参数）

function push(array: any[], ...items: any[]) {
    items.forEach(function(item) {
        array.push(item);
    });
}

let a = [];
push(a, 1, 2, 3);

注意，rest 参数只能是最后一个参数，关于 rest 参数，可以参考 ES6 中的 rest 参数。

函数重载

重载允许一个函数接受不同数量或类型的参数时，作出不同的处理。

// 函数重载
let user: number[] = [1, 2, 3]

// 前几次都是函数定义，最后一次是函数实现。在编辑器的代码提示中，可以正确的看到提示
function findNum(add: number[]): number[] // 如果传的是一个number类型的数组那就做添加
function findNum(): number[] // 如果没有传入东西就是查询全部
function findNum(id: number): number[] // 如果传入了id就是单个查询
function findNum(ids?: number | number[]): number[] {
  if (typeof ids == 'number') {
    return user.filter((v) => v == ids)
  } else if (Array.isArray(ids)) {
    user.push(...ids)
    return user
  } else {
    return user
  }
}

console.log(findNum([1, 2, 3, 5]))