typescript中的class与interface和type的区别

目录

Interface(接口)

 Class(类)

Type(类型)

区别和用途

declare class和declare namespace的区别

declare class

declare namespace

declare interface

declare 和 export interface

总结

其他资源


在TypeScript中,interface和class都是用来定义类型的工具,但它们有不同的用途和功能。

Interface(接口)

接口是用来描述对象的形状(Shape),也就是对象应该具备哪些属性和方法。它是一种纯粹的类型,不包含任何实现。

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

接口通常用于声明对象的类型,以便在代码中使用该类型时进行类型检查和推断。在下面的示例中,我们声明了一个接口Person用来参数传递,用于指定一个人的基本信息类型。

function sayHello(person: Person) {console.log(`Hello, ${person.name}!`);
}let myFriend = {name: "Alice",age: 30,greet() {console.log("Hi there!");}
};sayHello(myFriend);

接口还可以用于定义对象的结构和行为的规范。 接口定义了对象应具备的属性和方法,但不提供实现。 接口可以用来描述类的公共部分,并且类可以实现一个或多个接口。 接口可以继承其他接口。

以下是一个Interface的代码示例:

// 定义接口
interface Shape {// 定义抽象方法  calculateArea(): number;
}// 通过implements实现以上的接口
class Circle implements Shape {radius: number;// 构造器constructor(radius: number) {this.radius = radius;}// 实现Shape接口方法calculateArea() {return Math.PI * this.radius ** 2;}
}// 实例化Circle
const circle = new Circle(5);
// 调用计算面积方法
console.log(circle.calculateArea());

 Class(类)

类是用来创建对象的蓝图,它包含属性和方法的定义,还可以包含构造函数。类实际上是一种值的定义和实现。

class Dog {name: string;constructor(name: string) {this.name = name;}bark() {console.log("Woof!");}
}

类通常用于创建实例化的对象,具有特定的行为和状态。在下面的示例中,我们定义了一个Dog类,用于创建一个具有name属性和bark方法的狗的实例。

let myDog = new Dog("Buddy");
console.log(myDog.name); // 输出 "Buddy"
myDog.bark(); // 输出 "Woof!"

Type(类型)

Type是用于定义数据的形状或结构。 Type可以定义基本类型(如number、string、boolean等)或自定义Type(如对象、数组、元组等)。 不支持继承其他Type, 但Type可以使用联合类型、交叉类型等进行复杂定义。 Type可以使用泛型来增加通用性和灵活性。

以下是一个Type的代码示例:

// 描述了一个拥有x和y属性的对象
type Point = {x: number;y: number;
};// 描述了一个拥有id和name属性的对象
type Student = {id: number;name: string;
};// 描述了一个拥有success和data属性的对象,并且data属性可以是string或number类型
type Result = {success: boolean;data: string | number;
};// 定义函数别名,可多处复用(T是一个泛型,此type描述了一个接受泛型参数并返回void的函数类型)
type Callback<T> = (result: T) => void;// KeyValues类型接收了一个类型参数 T,并使用 extends object 来限制 T 必须是一个对象类型
type KeyValues<T extends object> = {[K in keyof T]: T[K];
};const obj: KeyValues<{ name: string, age: number }> = {name: "John Doe",age: 25
};

区别和用途

接口主要用于描述数据的形状,用于类型检查和约束。它通常用于定义对象的类型,以及函数的参数和返回值的类型。

类主要用于创建对象的实例,具有属性和方法的定义和实现。它通常用于创建具体的对象,进行对象的实例化和操作。

在使用时,通常考虑以下几点:

  • 当需要描述对象的形状和类型时,应该使用接口。
  • 当需要创建具体的对象实例,定义对象的行为和状态时,应该使用类。
  • 在定义函数的参数和返回类型时,可以使用接口便于统一锲约.

总之,接口用于描述类型,而类用于创建对象。

declare classdeclare namespace的区别

在 TypeScript 中,创建 .d.ts 源声明文件时,时常看到有时用declare class,有时候用declare namespace,它们之间有什么区别?

在TypeScript中,.d.ts声明文件通常用于描述 JavaScript 库、模块或全局变量的类型信息。在创建声明文件时,可以使用declare关键字来声明类、命名空间和接口的类型信息。

如果你有 C++ 背景,你可以粗略地将 interface 视为 typedef 并将 declare class 视为 extern 在此编译单元中严格缺少定义的构造函数声明。

declare class

declare class用于声明一个类的类型信息,并且在声明文件中不包含实际的类实现。这样做的目的是告诉TypeScript在编译时该类会在其他地方定义,仅仅只是一个类型声明。

// example.d.ts
declare class MyLibrary {constructor(name: string);sayHello(): void;
}

在这个例子中,我们使用declare class声明了一个MyLibrary类的类型,但是并没有提供实际的类实现。这样在其他文件中就可以使用这个类而不报错。

declare namespace

declare namespace用于声明一个命名空间的类型信息,定义在全局变量、模块或类里的对象。它通常用于描述全局变量或库的模块化结构,可以包含变量、函数、类、嵌套命名空间等。

// example.d.ts
declare namespace MyLibrary {interface Configuration {apiKey: string;endpoint: string;}function init(config: Configuration): void;
}

在这个例子中,我们使用declare namespace声明了一个MyLibrary命名空间,并在其中描述了配置接口和初始化函数。这样在其他文件中可以引用这个命名空间中的类型信息。

declare interface

declare interface用于声明一个接口的类型信息,该接口可以描述对象的形状和类型。它用于描述对象的类型,并且不包含实际的实现。

// example.d.ts
declare interface Person {name: string;age: number;sayHello(): void;
}

在这个例子中,我们使用declare interface声明了一个Person接口的类型信息,用于描述一个具有nameagesayHello方法的对象。

declare 和 export interface

declare用于描述在类型声明文件中的类型信息,告诉TypeScript这些类型不是在当前文件中实际实现的,而是在其他地方定义的。

export用于在模块中导出接口或声明,使其可以在其他模块中被引用。

.d.ts声明文件中通常不需要使用export关键字,因为它主要用于导出模块中的成员。在类型声明文件中,使用declare就足够了。

综上所述,declare classdeclare namespacedeclare interface都用于声明类型信息,但是用途和语境略有不同。declareexport关键字也有不同的作用,前者用于描述类型信息,后者用于导出模块成员。

总结

在 TypeScript 中,type、interface 和 class 分别具有自己的用途和特点。

type 适用于定义类型别名、联合类型、交叉类型等,并且不需要运行时信息。

interface 主要用于定义对象的类型和形状,支持继承和实现。

class 既包含类型信息,也包含实际的属性和方法实现。在实际开发中,我们应根据需求选择合适的类型声明方式。

虽然 type 和 interface 在很多场景下可以互换使用,但它们在某些特定场景下有着各自的优势

type 更适用于组合不同类型,如联合类型、交叉类型等,而 interface 更适用于定义对象的形状

特别是在面向对象编程中,class 则提供了完整的类型定义和实现,可以在运行时进行实例化和操作。

在实践中,我们应该根据实际需求和场景选择合适的类型声明方式。

Class是用于定义对象的结构和行为,它是数据和行为的封装。 Interface是用于描述对象的结构和行为的规范,它是对类的抽象。 Type是用于定义数据的形状和结构,它是对数据的抽象。

它们之间的区别在于使用方式和目的不同。Class用于创建对象,Interface用于定义规范,而Type用于定义数据类型。在实际应用中,根据具体需求选择合适的工具。

例如,在定义一个复杂的对象类型时可以使用 interface,在接口参数或返回类型时可以使用interface;在组合不同类型时,可以使用 type;在创建具有行为的对象时,可以使用 class。

其他资源

TypeScript 中的class和interface | w3cschool笔记

https://blog.51cto.com/u_16213678/8476484

https://www.cnblogs.com/minigrasshopper/p/7693478.html

TypeScript中Class Interface Type的定义和区别_ts class interface type-CSDN博客

TypeScipt的class、interface、type区别 - 知乎

javascript - TypeScript 中的 "declare class"和 "interface"有什么区别 - IT工具网

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

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

相关文章

有什么办法解决SQL注入问题

随着互联网的普及和数字化进程的加速&#xff0c;Web攻击已经成为网络安全领域的一大威胁。Web攻击不仅可能导致个人隐私泄露、财产损失&#xff0c;还可能对企业和国家的安全造成严重影响。下面德迅云安全就分享一种常见的web攻击方式-SQL注入&#xff0c;了解下什么是SQL注入…

【VSCode】设置 一键生成vue模板 的快捷入口

问题 每次写一个组件的时候&#xff0c;都需要去手敲默认结构或者是复制粘贴&#xff0c;十分的麻烦&#xff01; 解决办法 文件 > 首选项 > 用户代码片段 > vue.json 配置vue模板 其中prefix是用来触发代码段的内容&#xff0c;即模版的快捷入口&#xff1b;body里…

牛客网 字符逆序

题目: 答案一&#xff08;用getchar&#xff09;&#xff1a; #include <stdio.h> int main() {char str[10000];int i 0;while ((str[i] getchar()) ! \n){i;}i--; //去掉\nwhile (i > 0){printf("%c", str[i--]);}return 0; } 答案二&#xff08;用f…

CMNet:Contrastive Magnification Network for Micro-Expression Recognition 阅读笔记

AAAI 2023的一篇文章&#xff0c;东南大学几位老师的工作&#xff0c;用于做微表情识别中的运动增强工作&#xff0c; 以下是阅读时记录的笔记。 摘要&#xff1a; However,existing magnification strategies tend to use the features offacial images that include not onl…

20240219画图程序

1. PTZ在惯性态时&#xff0c;不同视场角下的【发送】角速度和【理论响应】角速度 1.1 优化前 import numpy as np import matplotlib.pyplot as plt# PTZ在惯性态时&#xff0c;不同视场角下的【发送】角速度和【理论响应】角速度 ATROffset_x np.linspace(0, 60, 120) y2 …

C++题目打卡2.18

从今天开始我们又将讲4天题目。 题目列表 1.分配T4 2.组合T5 #分配T4 这里很明显是&#xff08;200 110&#xff09; - 330的差值最小。 我们先想到了一个想法就是输入时哪个堆大,加那个。 #include <bits/stdc.h> using namespace std; int main(){int n, ans1 0, …

Nodejs 第三十八章(mysql2)

在之前的篇章中&#xff0c;已经补充完成mysql的基本知识&#xff0c;那么现在开始&#xff0c;我们需要把mysql和express,nodejs连接起来。 安装依赖 npm install mysql2 express js-yamlmysql2 用来连接mysql和编写sq语句express 用来提供接口 增删改差js-yaml 用来编写配置…

达梦数据库——日常使用问题记录_未完待续

记录达梦数据库在日常使用中遇到的一些小问题&#xff0c;持续更新... 案例一&#xff1a;表空间扩容报错‘表空间上有事务未提交’ 原因&#xff1a;有会话查询表空间系统视图&#xff0c;或的确有表空间操作&#xff1b; 解决方法&#xff1a;结束相关会话 select SP_CLOSE…

300分钟吃透分布式缓存-04讲:缓存失效、穿透和雪崩问题怎么处理?

前面讲解了缓存的原理、引入&#xff0c;以及设计架构&#xff0c;总结了缓存在使用及设计架构过程中的很多套路和关键考量点。实际上&#xff0c;在缓存系统的设计架构中&#xff0c;还有很多坑&#xff0c;很多的明枪暗箭&#xff0c;如果设计不当会导致很多严重的后果。设计…

基于Java (spring-boot)的校园二手交易平台

一、项目介绍 基于Java (spring-boot)的校园二手交易平台&#xff1a;前端主要包含登录注册、求购商品、发布商品、举报、评论五个核心管理模块。后端则主要包含系统设置、物品管理、学生管理、评论管理、举报管理、新闻公告六个核心管理模块。通过此模式不同属性的用户可在系统…

白话微机:6.解释RTOS以及一些考研面试问题

一. 前言&#xff08;总结世界观&#xff09; 很久很久以前&#xff0c;有这样一个世界&#xff0c;这个世界有着现实世界一样的元素&#xff1a;那里的人又有一个别的名字叫做“数据”&#xff0c;人有0有1&#xff1b;人们也有住房&#xff0c;这些住房在这个世界叫做“存储器…

纯净住宅代理有何优势?为什么要用它?

随着互联网的快速发展&#xff0c;代理服务器已经成为许多在线活动的关键组成部分&#xff0c;从数据挖掘到网络安全。然而&#xff0c;随着技术的不断发展&#xff0c;住宅IP代理正崭露头角&#xff0c;因其在保障隐私、提升性能和应对封锁方面的卓越优势而备受瞩目。本文将深…