文登城乡建设局网站,10月上海娱乐场所又要关门了,新乡网站建设找哪家,wordpress中文建站一、是什么
函数是 JavaScript 应用程序的基础#xff0c;帮助我们实现抽象层、模拟类、信息隐藏和模块
在 TypeScript 里#xff0c;虽然已经支持类、命名空间和模块#xff0c;但函数仍然是主要定义行为的方式#xff0c;TypeScript 为 JavaScript 函数添加了额外的功能…
一、是什么
函数是 JavaScript 应用程序的基础帮助我们实现抽象层、模拟类、信息隐藏和模块
在 TypeScript 里虽然已经支持类、命名空间和模块但函数仍然是主要定义行为的方式TypeScript 为 JavaScript 函数添加了额外的功能丰富了更多的应用场景
函数类型在 TypeScript 类型系统中扮演着非常重要的角色它们是可组合系统的核心构建块
二、使用方式
跟javascript 定义函数十分相似可以通过funciton 关键字、箭头函数等形式去定义例如下面一个简单的加法函数
const add (a: number, b: number) a b上述只定义了函数的两个参数类型这个时候整个函数虽然没有被显式定义但是实际上 TypeScript 编译器是能够通过类型推断到这个函数的类型如下图所示 当鼠标放置在第三行add函数名的时候会出现完整的函数定义类型通过: 的形式来定于参数类型通过 连接参数和返回值类型
当我们没有提供函数实现的情况下有两种声明函数类型的方式如下所示
// 方式一
type LongHand {(a: number): number;
};// 方式二
type ShortHand (a: number) number;当存在函数重载时只能使用方式一的形式
可选参数
当函数的参数可能是不存在的只需要在参数后面加上 ? 代表参数可能不存在如下
const add (a: number, b?: number) a (b ? b : 0)这时候参数b可以是number类型或者undefined类型即可以传一个number类型或者不传都可以
剩余类型
剩余参数与JavaScript的语法类似需要用 ... 来表示剩余参数
如果剩余参数 rest 是一个由number类型组成的数组则如下表示
const add (a: number, ...rest: number[]) rest.reduce(((a, b) a b), a)函数重载
允许创建数项名称相同但输入输出类型或个数不同的子程序它可以简单地称为一个单独功能可以执行多项任务的能力
关于typescript函数重载必须要把精确的定义放在前面最后函数实现时需要使用 |操作符或者?操作符把所有可能的输入类型全部包含进去用于具体实现
这里的函数重载也只是多个函数的声明具体的逻辑还需要自己去写typescript并不会真的将你的多个重名 function 的函数体进行合并
例如我们有一个add函数它可以接收 string类型的参数进行拼接也可以接收 number 类型的参数进行相加如下
// 上边是声明
function add (arg1: string, arg2: string): string
function add (arg1: number, arg2: number): number
// 因为我们在下边有具体函数的实现所以这里并不需要添加 declare 关键字// 下边是实现
function add (arg1: string | number, arg2: string | number) {// 在实现上我们要注意严格判断两个参数的类型是否相等而不能简单的写一个 arg1 arg2if (typeof arg1 string typeof arg2 string) {return arg1 arg2} else if (typeof arg1 number typeof arg2 number) {return arg1 arg2}
}三、区别
从上面可以看到
从定义的方式而言typescript 声明函数需要定义参数类型或者声明返回值类型typescript 在参数中添加可选参数供使用者选择typescript 增添函数重载功能使用者只需要通过查看函数声明的方式即可知道函数传递的参数个数以及类型
