『TypeScript』深入理解变量声明、函数定义、类与接口及泛型

2023-12-07 23:13

本文主要是介绍『TypeScript』深入理解变量声明、函数定义、类与接口及泛型,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

请添加图片描述

请添加图片描述
📣读完这篇文章里你能收获到

  • 了解TypeScript变量声明与类型注解
  • 掌握TypeScript函数与方法的使用
  • 掌握TypeScript类与接口的使用
  • 掌握TypeScript泛型的应用

请添加图片描述

文章目录

  • 一、变量声明与类型注解
    • 1. 变量声明
    • 2. 类型注解
    • 3. 类型推断
  • 二、函数与方法定义
    • 1. 函数定义
    • 2. 方法定义
    • 3. 参数和返回类型
  • 三、类与接口的使用
    • 1. 类(Class)
      • 1.1 定义类
      • 1.2 创建对象
    • 2. 接口(Interface)
      • 2.1 定义接口
      • 2.2 实现接口
      • 2.3 使用接口
  • 四、泛型的应用
    • 1. 什么是泛型?
    • 2. 泛型类型
    • 3. 泛型约束

请添加图片描述

一、变量声明与类型注解

1. 变量声明

在TypeScript中,我们可以使用关键字let或const来声明变量。let用于声明可变的变量,而const用于声明不可变的变量(常量)。通过这种方式,我们可以限制变量被修改的范围,减少潜在的错误。

let count: number = 10;
const name: string = "John";

2. 类型注解

类型注解是TypeScript中的一个重要概念,它允许我们明确指定变量的类型。通过在变量后面使用冒号(:)加上类型,我们可以告诉编译器应该为变量分配何种类型。

let count: number = 10;
let name: string = "John";

类型注解能够提供更好的类型安全性,让我们在编码过程中更早地发现潜在的类型错误。

3. 类型推断

TypeScript还支持类型推断,即根据变量的初始值自动推断出变量的类型。当我们没有显式地指定变量的类型时,TypeScript会根据上下文推断出变量的类型。

let count = 10; // 推断为number类型
let name = "John"; // 推断为string类型

类型推断的好处是可以减少代码中的冗余,同时仍然提供了类型安全性。我们无需在每一个变量声明中都显式地指定类型,TypeScript能够自动推断正确的类型。

请添加图片描述

二、函数与方法定义

在TypeScript中,函数和方法的定义是非常重要的,因为它们是构建可维护、可扩展和可重用代码的基础。本文将介绍如何在TypeScript中定义函数和方法,并探讨一些最佳实践。

1. 函数定义

在TypeScript中,你可以使用function关键字来定义一个函数。下面是一个简单的示例:

function greet(name: string): void {console.log(`Hello, ${name}!`);
}

上面的代码定义了一个名为greet的函数,它接受一个字符串类型的参数name并且不返回任何值(void表示没有返回值)。在调用这个函数时,你需要传入一个字符串作为参数。

2. 方法定义

在面向对象的编程中,方法是与类相关联的函数。在TypeScript中,方法的定义也很简单:

class Greeter {private greeting: string;constructor(greeting: string) {this.greeting = greeting;}greet() {console.log(`Hello, ${this.greeting}!`);}
}

上面的代码定义了一个名为Greeter的类,其中包含一个名为greet的方法。在这个例子中,greet方法并不接受任何参数,它直接访问类的成员变量greeting并输出相应的问候语。

3. 参数和返回类型

在TypeScript中,你可以为函数和方法指定参数的类型以及返回值的类型。这有助于提高代码的可读性和健壮性。下面是一个带有参数和返回类型的函数定义示例:

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

在上面的示例中,add函数接受两个number类型的参数x和y,并返回它们的和作为number类型的结果。

请添加图片描述

三、类与接口的使用

1. 类(Class)

类是面向对象编程的基本概念,它是一种将数据和行为组合在一起的结构。在 TypeScript 中,我们可以使用类来创建对象,并通过类的实例来访问对象的属性和方法。

1.1 定义类

类使用 class 关键字进行定义,以下是一个简单的类示例:

class Animal {name: string;constructor(name: string) {this.name = name;}walk(): void {console.log(`${this.name} is walking.`);}
}

1.2 创建对象

通过类来创建对象的过程称为实例化。我们可以使用 new 关键字来实例化一个类,并获取一个类的实例。

const cat = new Animal("Tom");
cat.walk(); // 输出: "Tom is walking."

2. 接口(Interface)

接口是一种抽象的定义,它描述了对象的行为和属性。在 TypeScript 中,我们可以使用接口来定义对象的结构,并进行类型检查。

2.1 定义接口

接口使用 interface 关键字进行定义,以下是一个简单的接口示例:

interface Person {name: string;age: number;sayHello(): void;
}

2.2 实现接口

接口本身并不具备任何实际的数据,它只是一种规范或约束。我们需要通过类来实现接口,并提供具体的实现。

class Student implements Person {name: string;age: number;constructor(name: string, age: number) {this.name = name;this.age = age;}sayHello(): void {console.log(`Hello, my name is ${this.name}, I'm ${this.age} years old.`);}
}

2.3 使用接口

一旦我们定义了接口,并且通过类实现了接口,我们就可以使用接口来进行类型检查和约束。

function printInfo(person: Person): void {person.sayHello();
}const student = new Student("Tom", 20);
printInfo(student);

请添加图片描述

四、泛型的应用

1. 什么是泛型?

泛型是一种在编程中使用类型参数来创建可重用代码的方法。通过泛型,我们可以编写能够处理多种类型数据的代码,而不需要针对每种类型都编写一遍。

function identity<T>(arg: T): T {return arg;
}

在上面的示例中,我们定义了一个identity函数,它使用了一个类型参数T。这个函数可以接收任何类型的值,并返回相同类型的值。在这里,我们可以将T看作是一个占位符,当我们实际调用这个函数时传入的类型会替换掉它。

2. 泛型类型

除了可以使用泛型函数,我们还可以创建泛型类型。泛型类型在实现某些数据结构时非常有用,例如数组或元组。

interface Box<T> {contents: T;
}let box1: Box<number> = { contents: 42 };
let box2: Box<string> = { contents: "hello" };

在上面的示例中,我们定义了一个Box接口,它使用了一个类型参数T,表示这个盒子中可以装任何类型的物品。我们可以使用不同的类型参数来定义不同的Box,例如box1是一个存储数字的盒子,而box2是一个存储字符串的盒子。

3. 泛型约束

有时候,我们希望泛型能够处理某些特定类型的数据,而不是任何类型。在这种情况下,我们可以使用泛型约束。

interface Lengthwise {length: number;
}function loggingIdentity<T extends Lengthwise>(arg: T): T {console.log(arg.length);return arg;
}loggingIdentity("hello world"); // 输出 11

在上面的示例中,我们定义了一个Lengthwise接口,它表示拥有一个length属性的对象。然后我们定义了一个泛型函数loggingIdentity,并使用extends关键字来限制泛型参数T必须继承自Lengthwise接口。这样一来,我们就可以在函数内部使用arg.length属性。

请添加图片描述

请添加图片描述

这篇关于『TypeScript』深入理解变量声明、函数定义、类与接口及泛型的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/467681

相关文章

pandas使用apply函数给表格同时添加多列

《pandas使用apply函数给表格同时添加多列》本文介绍了利用Pandas的apply函数在DataFrame中同时添加多列,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习... 目录一、Pandas使用apply函数给表格同时添加多列二、应用示例一、Pandas使用apply函

requests处理token鉴权接口和jsonpath使用方式

《requests处理token鉴权接口和jsonpath使用方式》文章介绍了如何使用requests库进行token鉴权接口的处理,包括登录提取token并保存,还详述了如何使用jsonpath表达... 目录requests处理token鉴权接口和jsonpath使用json数据提取工具总结reques

Nginx内置变量应用场景分析

《Nginx内置变量应用场景分析》Nginx内置变量速查表,涵盖请求URI、客户端信息、服务器信息、文件路径、响应与性能等类别,这篇文章给大家介绍Nginx内置变量应用场景分析,感兴趣的朋友跟随小编一... 目录1. Nginx 内置变量速查表2. 核心变量详解与应用场景3. 实际应用举例4. 注意事项Ng

Python中Namespace()函数详解

《Python中Namespace()函数详解》Namespace是argparse模块提供的一个类,用于创建命名空间对象,它允许通过点操作符访问数据,比字典更易读,在深度学习项目中常用于加载配置、命... 目录1. 为什么使用 Namespace?2. Namespace 的本质是什么?3. Namesp

python调用dubbo接口的实现步骤

《python调用dubbo接口的实现步骤》本文主要介绍了python调用dubbo接口的实现步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编... 目录 ​​其他实现方式与注意事项​​ ​​高级技巧与集成​​用 python 提供 Dubbo 接口

MySQL中如何求平均值常见实例(AVG函数详解)

《MySQL中如何求平均值常见实例(AVG函数详解)》MySQLavg()是一个聚合函数,用于返回各种记录中表达式的平均值,:本文主要介绍MySQL中用AVG函数如何求平均值的相关资料,文中通过代... 目录前言一、基本语法二、示例讲解1. 计算全表平均分2. 计算某门课程的平均分(例如:Math)三、结合

GO语言zap日志库理解和使用方法示例

《GO语言zap日志库理解和使用方法示例》Zap是一个高性能、结构化日志库,专为Go语言设计,它由Uber开源,并且在Go社区中非常受欢迎,:本文主要介绍GO语言zap日志库理解和使用方法的相关资... 目录1. zap日志库介绍2.安装zap库3.配置日志记录器3.1 Logger3.2 Sugared

Java中接口和抽象类的异同以及具体的使用场景

《Java中接口和抽象类的异同以及具体的使用场景》文章主要介绍了Java中接口(Interface)和抽象类(AbstractClass)的区别和联系,包括相同点和不同点,以及它们在实际开发中的具体使... 目录一、接口和抽象类的 “相同点”二、接口和抽象类的 “核心区别”关键区别详解(避免踩坑)三、具体使

深入理解Redis线程模型的原理及使用

《深入理解Redis线程模型的原理及使用》Redis的线程模型整体还是多线程的,只是后台执行指令的核心线程是单线程的,整个线程模型可以理解为还是以单线程为主,基于这种单线程为主的线程模型,不同客户端的... 目录1 Redis是单线程www.chinasem.cn还是多线程2 Redis如何保证指令原子性2.

深入理解MySQL流模式

《深入理解MySQL流模式》MySQL的Binlog流模式是一种实时读取二进制日志的技术,允许下游系统几乎无延迟地获取数据库变更事件,适用于需要极低延迟复制的场景,感兴趣的可以了解一下... 目录核心概念一句话总结1. 背景知识:什么是 Binlog?2. 传统方式 vs. 流模式传统文件方式 (非流式)流