TypeScript 中函数的理解及其与 JavaScript 函数的差异

文章目录

    • 一、函数概述
    • 二、TypeScript 函数的使用
      • 函数类型的声明
      • 可选参数
      • 剩余参数
      • 函数重载
    • 三、TypeScript 与 JavaScript 函数的差异

一、函数概述

在 JavaScript 应用程序中,函数是核心组成部分,它们帮助我们实现代码的抽象、模拟类、隐藏信息和模块化。TypeScript 在保留 JavaScript 函数的基础上,提供了额外的功能和更丰富的应用场景。尽管 TypeScript 支持类、命名空间和模块,函数仍是定义行为的主要方式。在 TypeScript 的类型系统中,函数类型扮演着极其关键的角色,是构建可组合系统的核心。

二、TypeScript 函数的使用

TypeScript 中定义函数的方式与 JavaScript 非常相似,可以通过 function 关键字或箭头函数来定义。以下是一个简单的加法函数示例:

const add = (a: number, b: number) => a + b;

在这个例子中,我们为函数的参数指定了类型,而函数的返回类型则由 TypeScript 编译器通过类型推断得出。

函数类型的声明

在不需要提供函数实现的情况下,我们可以用以下两种方式声明函数类型:

// 方式一
type LongHand = {(a: number): number;
};
// 方式二
type ShortHand = (a: number) => number;

在函数重载的情况下,我们通常使用方式一进行声明。

可选参数

如果函数的参数可能不存在,可以在参数名后加上 ? 来表示该参数是可选的:

const add = (a: number, b?: number) => a + (b ?? 0);

这样,参数 b 可以是 number 类型或者不传递。

剩余参数

TypeScript 中的剩余参数使用 ... 语法表示,如下所示:

const add = (a: number, ...rest: number[]) => rest.reduce((sum, current) => sum + current, a);

函数重载

TypeScript 允许我们定义同名但参数类型或数量不同的函数,这被称为函数重载。在使用函数重载时,我们需要将精确的函数声明放在前面,而在实现函数时,需要包含所有可能的输入类型。
以下是一个函数重载的示例,该函数可以处理字符串拼接或数字相加:

function add(arg1: string, arg2: string): string;
function add(arg1: number, arg2: number): number;
function add(arg1: string | number, arg2: string | number) {if (typeof arg1 === 'string' && typeof arg2 === 'string') {return arg1 + arg2;} else if (typeof arg1 === 'number' && typeof arg2 === 'number') {return arg1 + arg2;}
}

三、TypeScript 与 JavaScript 函数的差异

从上述内容可以看出,TypeScript 函数与 JavaScript 函数的主要区别在于:

  • TypeScript 需要显式声明函数参数的类型和返回值类型(尽管编译器可以进行类型推断)。
  • TypeScript 支持可选参数,允许函数参数在调用时可选。
  • TypeScript 引入了函数重载,使得通过函数声明就能明确知道参数的数量和类型。

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

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

相关文章

【EXCEL数据处理】000013 案例 EXCEL筛选与高级筛选。

前言:哈喽,大家好,今天给大家分享一篇文章!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏关注哦 💕 目录 【EXCEL数据处理】000013 案例 EXCEL筛选与高级筛选。使用的软件&#…

【华为OD机试真题】95、最少面试官数

package mainimport ("fmt""sort" )type s struct {start intend intworkCount int }type duration struct {start intend int }// 查询时间段内是否有可用的面试官 func getFreeS(sList []*s, d *duration, workCountLimit int) (sIndex int)…

C0005.Clion中移动ui文件到新目录后,报错问题的解决

报错问题如下 AutoUic error ------------- "SRC:/confirmwizardpage.cpp" includes the uic file "ui_confirmwizardpage.h", but the user interface file "confirmwizardpage.ui" could not be found in the following directories"SRC…

Redis面试篇2

1、Redis缓存刷新策略有哪些? Redis提供了以下几种缓存刷新策略 基于过期时间:可以设置key的过期时间,当过期时间到达后,Redis会自动删除该key。基于LRU算法:Redis使用LRU算法来淘汰最近最少使用的key,以保…

内部类基础

成员内部类 // 外部类 public class OuterClass { private String outerVar "Outer Variable"; // 成员内部类 public class MemberInnerClass { private String innerVar "Inner Variable"; // 内部类的方法,可以访问外部类的成员变…

案例:问题处理与原因分析报告的模板

系统上线后暴露的问题也是一种财富,我们需要从中吸收经验教训,规避其他类似的问题。对于上线后的问题如何进行原因分析,我提供两个分析报告的模板,供大家参考。 模板案例1:共性现象的原因分析报告 模板案例二&#xf…

Java后端面试很水的,7天就能搞定!

随着Java的越来越卷,面试也直接上难度了,从以前的八股文到场景题了,尤其是有经验的去面试,场景题都是会问的,近期面试过的应该都深有体会! 场景题230道: 1.分布式锁加锁失败后的等待逻辑是如何…

人脸表情行为识别系统源码分享

人脸表情行为识别系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer Vis…

Webstorm 中对 Node.js 后端项目进行断点调试

首先,肯定需要有一个启动服务器的命令脚本。 然后,写一个 debug 的配置: 然后,debug 模式 启动项目和 启动调试服务: 最后,发送请求,即可调试: 这几个关键按钮含义: 重启…

基于单片机的智能浇花系统

目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 基于51单片机,采样DHT11温湿度传感器检测温湿度,通过LCD1602显示 4*4按键矩阵可以设置温度湿度阈值,温度大于阈值则开启水泵,湿度大于阈值则开启风扇…

Golang 服务器虚拟化应用案例

推荐学习文档 golang应用级os框架,欢迎stargolang应用级os框架使用案例,欢迎star案例:基于golang开发的一款超有个性的旅游计划app经历golang实战大纲golang优秀开发常用开源库汇总想学习更多golang知识,这里有免费的golang学习笔…

关于PPT生成的开源大模型总结

目前需要开源的PPT生成模型,在这里对github上的一些模型进行筛选 搜索关键词:ppt generate(more starts) williamfzc/chat-gpt-ppt: 支持直接生成PPT支持中英文需要调用ChatGPT(Add your token (official openai api k…

机器学习框架

机器学习框架 机器学习框架是用于开发和部署机器学习模型的软件工具。它们提供了一组API和工具,帮助开发人员在各种计算设备上构建、训练和部署机器学习模型。以下是几个常见的机器学习框架: 1.TensorFlow: TensorFlow是一个开源的人工智能…

【Matlab】Matlab 导入数据.csv或者.xlsx文件,然后使用这些数据来绘制图表

Matlab 导入数据.csv或者.xlsx文件,然后使用这些数据来绘制图表 初始数据 filename C:\Users\jia\Desktop\yadian\data\1Hz 2024_09_12 17_10_06.csv; 代码: clc;clear close all; % 读取Excel文件 filename C:\Users\jia\Desktop\yadian\data\1Hz …

智能手表(Smart Watch)项目

文章目录 前言一、智能手表(Smart Watch)简介二、系统组成三、软件框架四、IAP_F411 App4.1 MDK工程结构4.2 设计思路 五、Smart Watch App5.1 MDK工程结构5.2 片上外设5.3 板载驱动BSP5.4 硬件访问机制-HWDataAccess5.4.1 LVGL仿真和MDK工程的互相移植5…

注意,学会解决路由问题!(未完)

文章目录 Abstract1 Introduction2 相关工作3 注意力模型3.1 编码器3.2 解码器Abstract 最近提出的为组合优化问题学习启发式方法的想法很有前景,因为它可以节省昂贵的开发成本。然而,要将这一想法推向实际应用,我们需要更好的模型和更好的训练方法。我们在这两个方向都做出…

FreeRTOS-事件标志组

FreeRTOS-事件标志组 一、事件标志组简介二、事件标志组API函数三、事件标志组实验 一、事件标志组简介 事件标志位:用一个位来表示事件是否发生,裸机中的中断标志位等等事件标志组:是一组事件标志位的集合,简单认为就是一个整数…

C++ 秋招查缺补漏

结构体和类的区别 C 中 class 和 struct 区别 | 编程指北 (csguide.cn) C 中为了兼容 C 语言而保留了 C 语言的 struct 关键字,并且加以扩充了含义。 在 C 语言中,struct 只能包含成员变量,不能包含成员函数。 而在 C 中,str…

Java_Se 容器2(Set 接口)

Set接口继承自Collection接口,Set接口中没有新增方法,它和Collection接口保持完全一致。我们在前面学习List接口的使用方式,在Set中仍然适用。因此,学习Set的使用将没有任何难度。Set接口特点Set特点:无序、不可重复。…

国庆作业

day1 1.开发环境 Linux系统GCCFDBmakefilesqlite3 2.功能描述 项目功能: 服务器:处理客户端的请求,并将数据存入数据库中,客户端请求的数据从数据库进行获取,服务器转发给客户端。 用户客户端:实现账号的注册、登…