TypeScript - 函数详解

最新推荐文章于 2024-05-18 00:30:00 发布

Cassy_Wu

最新推荐文章于 2024-05-18 00:30:00 发布

阅读量539

点赞数

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

本文链接：https://blog.csdn.net/Cassy_Wu/article/details/105255622

版权

本文详细探讨了TypeScript中的函数类型，包括定义函数类型、完整函数类型和推断类型。介绍了可选参数、默认参数的用法，以及剩余参数的概念。此外，还讨论了JavaScript中的`this`关键字及其在TypeScript中的处理方式，包括使用箭头函数绑定`this`。最后，文章阐述了TypeScript中函数重载的实现和类型检查规则。

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

JS中创建函数的两种方式

// 命名函数
function add(x, y) {
   
  return x + y;
}

// 匿名函数
let myAdd = function(x, y) {
    return x + y; };

函数类型

定义函数类型

参数类型 x: number
返回值类型 function add(x: number, y: number): number TypeScript可以通过查看return语句来弄清楚返回类型。通常省略不写。但是如果没有返回值推荐写上void而不是留空

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

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

function checkIn (x:string): void{
   
    console.log('haha');
}

完整函数类型

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

let newAdd: (baseValue: number, increment: number) => number =
function(x: number, y: number): number {
    return x + y; }; //在TypeScript里，只要参数类型匹配。就是有效的函数类型。不在乎你参数名是否正确

myAdd(1, 2) //3
newAdd(1, 2) //3

推断类型

即使你在赋值语句的一边指定了类型但是另一边没有类型的话，TypeScript编译器会自动识别出类型。这叫做”上下文归类”

// myAdd 有完整的函数类型
let myAdd = function(x: number, y: number): number {
    return  x + y; };

// x, y有number类型
let newAdd: (baseValue: number, increment: number) => number =
    function(x, y) {
    return x + y; };

可选参数，默认参数

在TypeScript中，每个函数参数都是必须的，编译器会检查用户是否为每个参数都传入了值（null和undefined也算）。传入的参数个数必须跟函数的参数个数保持一致。

区别：在Javascript中，每个参数都是可传可不传的。没传值的时候，参数的值就是undefined

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

let result1 = buildName("Bob");                  // erro 少入要求的参数个数
let result2 = buildName("Bob", "Adams", "Sr.");  // error 超处要求的参数个数
let result3 = buildName("Bob", "Adams"); // "Bob Adams"

可选参数
写法：参数名？：类型
注：可选参数必须跟在必须参数后面。

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 超处要求的参数个数
  let result3