《三》TypeScript 中函数的类型

news2024/12/26 11:21:37

TypeScript 允许指定函数的参数和返回值的类型。

  1. 函数声明的类型定义:function 函数名(形参: 形参类型, 形参: 形参类型, ...): 返回值类型 {}

    function sum(x: number, y: number): number {
        return x + y
    }
    sum(1, 2) // 正确
    sum(1, 2, 3) // 错误。输入多余的或者少于要求的参数,都是不被允许的
    
  2. 函数表达式的类型定义:const 函数名: (形参: 形参类型, 形参: 形参类型, ...) => 返回值类型 = function () {}

    对函数本身进行类型声明:(形参: 形参类型, 形参: 形参类型, ...) => 返回值类型
    对没有参数和没有返回值的函数本身进行类型声明:() => void

    // 不规范的写法。可以通过编译,但事实上只是对等号右侧的匿名函数进行了类型定义,而等号左边 sum 是赋值操作后进行类型推论而推断出来的,并没有对 sum 函数本身进行类型声明
    const sum = function (x: number, y: number): number {
        return x + y
    }
    
    // 规范的写法。在 TypeScript 的类型定义中,=> 用来表示函数的定义,左边是输入类型,需要用括号括起来,右边是输出类型。
    const sum: (x: number, y: number) => number = function (x: number, y: number): number {
        return x + y
    }
    
    // 规范的写法还可以进行一些省略。在函数引用中定义好了函数的参数类型和返回值类型,那么函数体可以省略,不需要再次指定类型
    const sum: (x: number, y: number) => number = function (x, y) {
        return x + y
    }
    
  3. 函数的调用签名(Call Signatures):函数除了作为函数本身可以被调用外,还可以作为对象有属性和方法。但是,函数声明的类型定义和函数表达式的类型定义并不支持声明属性和方法,此时可以使用函数的调用签名。

    
    // 函数的调用签名的写法:可以用 Type,也可以用 interface
    type sumType = {
      // 对函数作为对象的属性值和方法的类型定义
      name: string,
      // 对函数作为函数本身的类型定义。写法为 (参数列表): 返回值类型
      (x: number, y: number): number,
    }
    
    const sum: sumType = function (x: number, y: number): number {
      return x + y
    }
    sum.name = 'sumFunc'
    sum(1, 2)
    
  4. 函数的构造签名:函数除了可以直接调用外,还可以使用 new 操作符调用。当通过 new 操作符调用时,TypeScript 就会认为这个函数是一个构造函数,会产生一个实例对象。此时,可以使用函数的构造签名,方法是在调用签名前面加一个 new 关键词。

    对函数进行普通的函数类型定义,也可以使用 new 操作符来调用。但是,TypeScript 类型推断出来的实例对象的类型是 any。
    请添加图片描述

    class Person {}
    
    type PersonType = {
      new (): Person,
    }
    
    function factory(callback: PersonType) {
      const p = new callback()
      return p
    }
    factory(Person)
    

    请添加图片描述

函数可选参数的类型定义:

可以用 ? 表示可选的参数,可选参数必须放在最后面。

function buildName(firstName: string, lastName?: string) {
    if (lastName) {
        return firstName + ' ' + lastName
    } else {
        return firstName
    }
}
let tomcat = buildName('Tom', 'Cat') // 正确
let tom = buildName('Tom') // 正确

在 ES6 中,允许给函数的参数添加默认值,TypeScript 会将添加了默认值的参数识别为可选参数,但此时不受可选参数必须放在最后面的限制。

function buildName(firstName: string = 'Tom', lastName: string) {
    return firstName + ' ' + lastName
}
let tomcat = buildName('Tom', 'Cat') // 正确
let cat = buildName(undefined, 'Cat') // 正确

函数重载的类型定义:

重载就是根据参数,选择相同函数名而参数不同的函数。严格来说,JS 中其实是没有函数重载的概念的。

在 TypeScript 中,可以去编写不同的重载签名来表示函数可以以不同的方式进行调用。一般是编写两个或者两个以上的重载签名,再去编写一个通用的函数实现。

// 实现函数接收两个参数,返回相加后的值。只能同时是数字,返回数字;或者同时是字符串,返回字符串
// 1. 先编写函数的重载签名:是没有实现体的
function add(arg1:number, arg2: number): number
function add(arg1:string, arg2: string): string
// 2. 然后编写通用的函数实现:是有实现体的
function add(arg1, arg2) {
  return arg1 + arg2
}

// 3. 在调用函数的时候,会根据传入的参数类型来决定执行函数体时,执行哪一个函数的重载签名
add(10, 20) // 正确
add('Hello', 'World') // 正确
add(10, 'World) // 错误。调用的是函数的重载签名,通用函数不能被调用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/630671.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CAN总线竞争与仲裁机制分析

1、CAN总线的接口 (1)CAN总线是串行、差分信号、异步总线,传输数据用两根信号线组成的差分信号线; (2)CANH和CANL是一组双绞线,两根线的电平差值表示逻辑1和0; 2、CAN总线显性、隐形电平 显性电平代表逻辑0,隐形电平代…

【Prometheus】mysqld_exporter+Grafana+AlertManager预警

环境 prometheus-2.44.0 mysqld_exporter-0.14.0 grafana-enterprise-9.1.2-1.x86_64.rpm alertmanager-0.25.0. 简介 mysql_exporter是用来收集MysQL或者Mariadb数据库相关指标的,mysql_exporter需要连接到数据库并有相关权限。既可以用二进制安装部署,…

08.JavaWeb-SpringMVC

2.SpringMVC Spring框架是一个开源的轻量级框架,SpringMVC是Spring的一个子框架 2.1SpringMVC工作机制 2.1.1 DispatcherServlet前端控制器 【不需要程序员开发】 作用:作为接受请求,响应结果,相当于转发器,中央处理…

『Jenkins』最新版Jenkins安装与Git集成—CentOS 7安装的详细教程

📣读完这篇文章里你能收获到 图文形式安装Jenkins在Jenkins集成Git并进行的配置感谢点赞收藏,避免下次找不到~ 文章目录 一、准备工作1. 安装Java Development Kit (JDK 11) 二、安装Jenkins1. 下载和安装最新版的Jenkins2. 启动Jenkins服务3. 将Jenkin…

【线性代数】

求解线性方程组 右乘向量/矩阵 把左边的矩阵拆成一个个列向量,右边的向量表示对左边列向量组的线性组合。 [ c o l 1 c o l 2 c o l 3 ] [ 3 4 5 ] [ 3 c o l 1 4 c o l 2 5 c o l 3 ] \left[\begin{array}{c} col_{1} & col_{2} & col_{3} \end{array}\…

类的三大特性——>封装

目录 理论知识 数据抽象: 封装: 细节知识 访问控制与封装 访问控制 STL使用封装 理论知识 类的基本思想是数据抽象、和封装。 数据抽象: 是一种依赖接口和实现分离的一种编程技术: 接口:包括用户所能执行的操…

点燃创作灵感:Prompt 实践指南揭秘!让 ChatGPT 更智能的六种策略(上)

在和 ChatGPT 对话中,Prompt 提示词的选择,如果遵循以下六种策略,我们将获得更好、更符合要求的回答。 这些策略,后几种更适合在编程调用 ChatGPT API 时使用,不过也适用直接和 ChatGPT 对话,让它更好的理解…

【LeetCode】HOT 100(7)

题单介绍: 精选 100 道力扣(LeetCode)上最热门的题目,适合初识算法与数据结构的新手和想要在短时间内高效提升的人,熟练掌握这 100 道题,你就已经具备了在代码世界通行的基本能力。 目录 题单介绍&#…

C语言之基于链表实现排序

题目&#xff1a;通过链表实现从小到大进行排序 代码&#xff1a; #include <stdio.h> #include <stdlib.h> #define N 9//通过链表实现从小到大排序 typedef struct node {int data;struct node *next; } NODE;//fun函数实现是将头结点的单向链表节点…

chatgpt赋能python:Python怎么倒序输出中文字典?

Python怎么倒序输出中文字典&#xff1f; 作为一门高效、易上手的编程语言&#xff0c;Python在数据处理、科学计算、机器学习等领域都有广泛应用。而对于SEO工程师来说&#xff0c;Python也是一款非常实用的工具。那么今天&#xff0c;我们就来探讨一下Python怎么倒序输出中文…

Sqlite 比较,安装,使用,个人总结

文章目录 什么是sqlite&#xff0c;和别的数据库有什么差别&#xff1f;sqlite介绍什么是边缘存储&#xff1f; sqlite存储上限sqlite和别的数据库的区别 Sqlite本地安装sqlite 在C# .net webapi 软件中的使用 什么是sqlite&#xff0c;和别的数据库有什么差别&#xff1f; sq…

【JavaSE】Java(五十七):核心要点总结

文章目录 1. HashMap 的实现原理2. Set 有哪些实现类3. HashSet 的实现原理4. 如何实现数组和List之间的转换5. Java中的迭代器 1. HashMap 的实现原理 HashMap 是一种基于哈希表的数据结构&#xff0c;它的实现原理简单来说就是将键值对存储在一个数组中&#xff0c;并通过哈希…

深入理解深度学习——注意力机制(Attention Mechanism):自注意力(Self-attention)

分类目录&#xff1a;《深入理解深度学习》总目录 相关文章&#xff1a; 注意力机制&#xff08;AttentionMechanism&#xff09;&#xff1a;基础知识 注意力机制&#xff08;AttentionMechanism&#xff09;&#xff1a;注意力汇聚与Nadaraya-Watson核回归 注意力机制&#…

强化服务器安全!CentOS 7如何使用fail2ban防范SSH暴力破解攻击?

前言 本文主要讲解centos7操作系统下&#xff0c;如何使用fail2ban防范SSH暴力破解。 &#x1f3e0;个人主页&#xff1a;我是沐风晓月 &#x1f9d1;个人简介&#xff1a;大家好&#xff0c;我是沐风晓月&#xff0c;阿里云社区博客专家 &#x1f609;&#x1f609; &#x1…

如何使用Python生成跑马灯视频

在这篇博客中&#xff0c;我将向您展示如何使用Python语言生成一个简单的跑马灯视频。我们将使用OpenCV和Pillow两个库来实现这个功能。 安装依赖库 首先&#xff0c;我们需要安装opencv-python和Pillow两个库。您可以使用以下命令来安装它们&#xff1a; pip install opencv…

Navicat 设置PostgreSQL数据库的表主键ID自增

文章目录 1 新建序列1.1 手动新建1.2 SQL语句新建 2 设置主键自增 1 新建序列 1.1 手动新建 选择 其他->序列 选择一个模式&#xff08;例如public&#xff09;&#xff0c;然后选择新增序列。 设置序列参数 刷新序列列表即可看到新建的序列 注意&#xff1a; 序列的最大…

C语言实现2048小游戏

大部分同学学习C语言编程以后不知道能通过什么样的项目才可以锻炼自己的思维功力&#xff0c;2048相信大家都应该熟悉&#xff0c;不管是手机上还是网页版的相信大家都玩过,这个简单的控制台版本的游戏是我曾经在伟易达上班时一个嵌入式应用游戏部门的大佬设计的&#xff0c;适…

简单使用gateway,以及gateway所需要的依赖

先声明&#xff0c;使用gateway需要有一定的SpringCloud的基础&#xff0c;再来使用时会看的很明白&#xff0c;使用前需要先开nacos服务&#xff0c;&#xff0c;确定无误。 下面直接开始 首先我们需要两个原来通信的模块&#xff0c;这里分别是service-const与service-provid…

《导航帖》-全系列软考A计划

专栏分享 点击跳转>Unity3D特效百例点击跳转>案例项目实战源码点击跳转>游戏脚本-辅助自动化点击跳转>Android控件全解手册点击跳转>Scratch编程案例点击跳转>软考全系列 文章目录 &#x1f449;关于作者&#x1f449;前提&#x1f449;链接追踪&#x1f449…

高通 Camera HAL3:项目开发技术点总结

做高通 Camera HAL3开发的一些技术点的总结、整理。 做个记录&#xff0c;方便后续查阅。 1.目录、so、配置文件 productName是项目名 out Target路径&#xff1a;\out\target\product\productName\chi-cdk&#xff1a;\vendor\qcom\proprietary\chi-cdk\ldc node&#xff1…