【typescript】面向对象(下篇),包含接口,属性的封装,泛型

假期第八篇,对于基础的知识点,我感觉自己还是很薄弱的。
趁着假期,再去复习一遍

面向对象:程序中所有的操作都需要通过对象来完成

计算机程序的本质就是对现实事物的抽象,抽象的反义词是具体。比如照片是对一个具体的人的抽象,汽车模型是对具体汽车的抽象等。

在程序中所有的对象被分成两个部分,数据和功能。以人为例,人的姓名,性别,年龄,身高,体重等属于数据,人可以走路,说话,吃饭,睡觉这些属于人的功能,数据在对象中被称为属性,而功能称之为方法

1、接口

接口与类型声明很相似,类型声明使用type关键字定义,接口(Interface)使用Interface关键字定义

类型声明可以描述一个对象的类型,对对象进行限制,可以用来定义基本类型、联合类型、交叉类型、元组类型等

type myType = {name: string,age:number
}const obj: myType = {name: '莲花',age:38
}

类型声明,相同的名只能声明一次

在这里插入图片描述

接口同样可以描述一个对象的类型,对对象进行限制

接口也可以当作类型声明去使用,接口也是用来定义一个类结构,用来定义一个类中应包含哪些属性和方法,多了少了都会波浪线提示

interface myInterface {name: string,age:number
}const obj: myInterface = {name: '莲花',age:38
}

但是接口可以重复声明
在这里插入图片描述
接口主要用于描述对象的结构和类型,因此更适用于被实现或继承的情况。
接口可以在定义类的时候去限制类的结构
接口中的所有属性都不能有实际的值
接口只定义对象的结构,而不考虑实际的值
在接口中所有方法都是抽象方法

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

接口支持一些类型声明不支持的特性,例如可选属性、只读属性、函数类型等。

interface Person {name: string;age?: number; // 可选属性readonly id: number; // 只读属性sayHello(): void; // 函数类型
}

类型声明不支持定义可选属性、只读属性等,但支持联合类型、交叉类型等高级类型的定义,比接口更加灵活。

type Person = {name: string;age: number;
} & {gender: 'male' | 'female'; // 交叉类型
} | {gender?: string; // 联合类型
};

类型声明主要用于定义类型别名和复杂类型

type Age = number;type Person = {name: string;age: Age;
};type Gender = 'male' | 'female';type PersonInfo = {name: string;age: Age;gender: Gender;
};

2、属性的封装

为什么需要属性的封装?当通过class定义类,通过实例对象可以随意修改属性,对于一些特定的属性,比如钱,比如年龄,都不应该被随意的修改,属性如果可以任意被修改,将导致对象中的数据变得非常不安全


class Person  {name: string;age: number;constructor(name: string, age: number){ this.name = name,this.age = age}}const person1 = new Person('莲花', 18)
person1.name = '楼楼'
person1.age = -38
console.log(person1, 'person1')

很显然年龄不应该是负数,但是因为对象属性可以任意修改,如果有需要用到年龄做计算的地方,一定是会出错的。
那如果不希望被随意修改,可以在属性前添加属性的修饰符
在这里插入图片描述
访问修饰符包括三种:

public:公共的,可以在类的内部和外部访问,默认值为 public。
private:私有的,只能在类的内部访问(修改)。
protected:受保护的,只能在类的内部和派生类中访问。

class Person {private name: string;protected age: number;public gender: string;constructor(name: string, age: number, gender: string) {this.name = name;this.age = age;this.gender = gender;}public sayHello() {console.log(`Hello, my name is ${this.name}, I'm ${this.age} years old.`);}
}class Student extends Person {public grade: number;constructor(name: string, age: number, gender: string, grade: number) {super(name, age, gender);this.grade = grade;}public study() {console.log(`${this.name} is studying in grade ${this.grade}.`);}
}const person = new Person('Alice', 18, 'female');
console.log(person.name); // 编译错误,name 是 private 属性,只能在类的内部访问
console.log(person.age); // 编译错误,age 是 protected 属性,只能在类的内部和派生类中访问
console.log(person.gender); // 可以访问,gender 是 public 属性
person.sayHello(); // 可以访问,sayHello 是 public 方法const student = new Student('Bob', 16, 'male', 10);
console.log(student.name); // 编译错误,name 是 private 属性,只能在类的内部访问
console.log(student.age); // 编译错误,age 是 protected 属性,只能在类的内部和派生类中访问
console.log(student.gender); // 可以访问,gender 是 public 属性
student.sayHello(); // 可以访问,sayHello 是 public 方法
console.log(student.grade); // 可以访问,grade 是 public 属性
student.study(); // 可以访问,study 是 public 方法

如果想获取Person 中定义为私有属性的name,可以通过定义方法,向外暴露属性和修改属性,虽然同样可以修改,但是属性的访问权是内部定的,暴露出来才可以访问,不暴露就是私有属性

class Person {private name: string;protected age: number;public gender: string;constructor(name: string, age: number, gender: string) {this.name = name;this.age = age;this.gender = gender;}public sayHello() {console.log(`Hello, my name is ${this.name}, I'm ${this.age} years old.`);}//定义方法,用来获取name属性getName() {return this.name}//定义方法,用来设置name属性,从外面传入valuesetName(value:string) { this.name = value}
}const person = new Person('Alice', 18, 'female');
person.getName(); // 可以访问,间接的拿到name属性
person.setName('张丫丫')

上面提到的年龄不可以设置负数,也就可以通过方法进行限制
getter方法用来读取属性,setter方法用来设置属性,它们被称为属性的存取器

      getAge() { return this.age}setAge(value: number) {//先判断年龄是否合法if (value >= 0) { return this.age = value}}

3、泛型

泛型是一种在编译时还不确定具体类型的变量或函数。使用泛型可以增加代码的灵活性和可重用性,使代码更加通用化

假如我们知道参数的类型,方法的返回值类型,可以这样写:

function fn(a: number): number { return a 
}
fn(1)

假如有些情况下,不知道参数和返回的具体类型是什么,类型可以写成any,确实可以,但是any实际上会关闭掉ts中的类型检查
参数是any,返回值是any,就有可能参数是字符串,返回值是数值

function fn(a: any): any{ return a 
}
fn(1)

所以在定义函数或类的时候,类型不明确就可以使用泛型
在方法名后面用尖括号,大写的T或者任意大写字母都可以
在这里插入图片描述
在这里插入图片描述
泛型T只有在函数执行的时候才知道具体是什么类型
两种方法调用:

function fn<T>(a: T): T { return a 
}// 方法一:直接调用,不知道泛型,TS也可以自动对类型进行推断
fn(1)
// 方法二:手动指定泛型,如果有很复杂的情况,类型推断无法推断的时候
fn<string>('1')

泛型可以指定多个

function fn2<T,K>(a: T,b:K): T { 
console.log(b);return a 
}fn2(10,'嘻嘻嘻')
或
fn2 <number,string>(10,'嘻嘻嘻')

如果想限制泛型的范围,定义一个接口,希望泛型是实现Inter接口的类

//T extends Inter 表示泛型必须是Inter的实现类(子类)

传参的时候要有length属性,传数字没有会提示类型’number’的参数不能赋值给类型’Inter’的参数,因为数字里没有length
在这里插入图片描述
传字符串或有length属性的对象就可以
在这里插入图片描述

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

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

相关文章

【C语言】八大排序算法

文章目录 一、冒泡排序1、定义2、思想及图解3、代码 二、快速排序1、hoare版本2、挖坑法3、前后指针法4、非递归快排5、快速排序优化1&#xff09;三数取中选key值2&#xff09;小区间优化 三、直接插入排序1、定义2、代码 四、希尔排序1、定义2、图解3、代码 五、选择排序1、排…

基于YOLOv8的安全帽检测系统(3):EMA基于跨空间学习的高效多尺度注意力、效果优于ECA、CBAM、CA,助力行为检测 | ICASSP2023

目录 1.Yolov8介绍 2.安全帽数据集介绍 3.EMA介绍 4.训练结果分析 1.Yolov8介绍 Ultralytics YOLOv8是Ultralytics公司开发的YOLO目标检测和图像分割模型的最新版本。YOLOv8是一种尖端的、最先进的&#xff08;SOTA&#xff09;模型&#xff0c;它建立在先前YOLO成功基础上…

超大视频如何优雅切片

背景 有一次录屏产生了一个大小为33G的文件, 我想把他上传到B站, 但是B站最大只支持4G. 无法上传, 因此做了一个简单的探索. 质疑与思考 a. 有没有一个工具或一个程序协助我做分片呢? 尝试 a. 必剪 > 有大小限制, 添加素材加不进去(而且报错信息也提示的不对) b. PR &…

GO 中优雅编码和降低圈复杂度

本次主要是聊聊关于使用接口抽象和降低圈复杂度的方式 工作中&#xff0c;难免会遇到老项目老代码&#xff0c;不仅仅需要我们维护&#xff0c;可能还需要我们在原来的垃圾代码上进行新增功能或者是进行优化调整 例如 现有的老代码中关于用户系统这一块就已经经是摇摇欲坠&a…

OpenMMLab【超级视客营】——支持InverseForm Loss(MMSegmentation的第三个PR)

文章目录 1. 任务目标1.1 issue1.2 原理相关资料&#xff08;论文讲解&#xff09;InverseFormSTN(Spatial Transformer Networks) 1.3 实现相关资料&#xff08;相关PR&#xff09; 2. 理解原理3. 代码实现3.X checklist3.0 Issue中的有效内容3.1 MMSegmentation支持multiple …

Context应用上下文理解

文章目录 一、Context相关类的继承关系Context类ContextIml.java类ContextWrapper类ContextThemeWrapper类 二、 什么时候创建Context实例创建Context实例的时机 小结 Context类 &#xff0c;说它熟悉&#xff0c;是应为我们在开发中时刻的在与它打交道&#xff0c;例如&#x…

大数据-玩转数据-双流JOIN

一、双流JOIN 在Flink中, 支持两种方式的流的Join: Window Join和Interval Join 二、Window Join 窗口join会join具有相同的key并且处于同一个窗口中的两个流的元素. 注意: 1.所有的窗口join都是 inner join, 意味着a流中的元素如果在b流中没有对应的, 则a流中这个元素就不会…

棉花叶病害数据集

Bacterial Blight&#xff08;细菌性枯萎病&#xff09;&#xff1a;细菌性枯萎病是由细菌引起的棉花疾病&#xff0c;主要受害部位是棉花的叶子和茎。这种病害可以导致叶片枯萎、变色和腐烂&#xff0c;对棉花产量产生不利影响。 Curl Virus&#xff08;卷叶病毒&#xff09;…

仿真调试说明——摘抄龙芯杯官方文件

1.仿真调试说明 你需要具备以下知识&#xff1a; 仿真工具的使用&#xff0c;比如Vivado的XsimVerilog的基本语法 通过本文的学习&#xff0c;你将获得&#xff1a;各类仿真错误排查的方法CPU逻辑出错的调试指导Verilog 运算符的优先级 1.1 调试指导思想概述 全局上的调试原…

多卡片效果悬停效果

效果展示 页面结构 从页面的结构上看&#xff0c;在默认状态下毛玻璃卡片是有层次感的效果叠加在一起&#xff0c;并且鼠标悬停在卡片区域后&#xff0c;卡片整齐排列。 CSS3 知识点 transform 属性的 rotate 值运用content 属性的 attr 值运用 实现页面整体布局 <div …

案例题--Web应用考点

案例题--Web应用考点 负载均衡技术微服务XML和JSON无状态和有状态真题 在选择题中没有考察过web的相关知识&#xff0c;主要就是在案例分析题中考察 负载均衡技术 应用层负载均衡技术 传输层负载均衡技术 就近的找到距离最近的服务器&#xff0c;并进行分发 使用户就近获取…

S32K144 GPIO编程

前面的文章介绍了如何在MDK-Keil下面进行S32K144的开发&#xff0c;下面就使用该工程模板进行GPIO LED的编程试验。 1. 开发环境 S32K144EVB-Q100开发板MDK-Keil Jlink 2. 硬件连接 S32K144EVB-Q100开发板关于LED的原理图如下&#xff1a; 也就是具体连接关系如下&#xf…

【C++】vector相关OJ

文章目录 1. 只出现一次的数字2. 杨辉三角3. 电话号码字母组合 ヾ(๑╹◡╹)&#xff89;" 人总要为过去的懒惰而付出代价ヾ(๑╹◡╹)&#xff89;" 1. 只出现一次的数字 力扣链接 代码展示&#xff1a; class Solution { public:int singleNumber(vector<i…

6-1 选择排序

#include <stdio.h>#define N 1000 int arr[N];/* 对长度为n的数组arr执行选择排序 */ void selectionSort(int arr[], int n);/* 打印长度为n的数组arr */ void printArray(int arr[], int n);void swap(int *xp, int *yp) {int temp *xp;*xp *yp;*yp temp; }int mai…

uniapp iOS离线打包——如何创建App并提交版本审核?

uniapp 如何创建App&#xff0c;并提交版本审核&#xff1f; 文章目录 uniapp 如何创建App&#xff0c;并提交版本审核&#xff1f;登录 appstoreconnect创建AppiOS 预览和截屏应用功能描述技术支持App 审核信息 App 信息内容版权年龄分级 价格与销售范围App 隐私提交审核 登录…

华为云云耀云服务器L实例评测|安装搭建学生成绩管理系统

1.前言概述 华为云耀云服务器L实例是新一代开箱即用、面向中小企业和开发者打造的全新轻量应用云服务器。多种产品规格&#xff0c;满足您对成本、性能及技术创新的诉求。云耀云服务器L实例提供丰富严选的应用镜像&#xff0c;实现应用一键部署&#xff0c;助力客户便捷高效的在…

mybatis-plus控制台打印sql(mybatis-Log)

配置了mybatis-plus.configuration.log-implorg.apache.ibatis.logging.stdout.StdOutImpl&#xff1b;但是mybatis执行的sql没有输出 需要检查点&#xff1a; 1、日志级别设置&#xff1a;请确保你的日志级别配置正确。如果日志级别设置得太低&#xff0c;可能导致SQL语句不…

计算机竞赛 题目:基于LSTM的预测算法 - 股票预测 天气预测 房价预测

文章目录 0 简介1 基于 Keras 用 LSTM 网络做时间序列预测2 长短记忆网络3 LSTM 网络结构和原理3.1 LSTM核心思想3.2 遗忘门3.3 输入门3.4 输出门 4 基于LSTM的天气预测4.1 数据集4.2 预测示例 5 基于LSTM的股票价格预测5.1 数据集5.2 实现代码 6 lstm 预测航空旅客数目数据集预…

【kubernetes】CRI OCI

1 OCI OCI(Open Container Initiative)&#xff1a;由Linux基金会主导&#xff0c;主要包含容器镜像规范和容器运行时规范&#xff1a; Image Specification(image-spec)Runtime Specification(runtime-spec)runC image-spec定义了镜像的格式&#xff0c;镜像的格式有以下几…

【多级缓存】

文章目录 1. JVM进程缓存2. Lua语法3. 实现多级缓存3.1 反向代理流程3.2 OpenResty快速入门 4. 查询Tomcat4.1 发送http请求的API4.2 封装http工具4.3 基于ID负载均衡4.4 流程小结 5. Redis缓存查询5.1 实现Redis查询 6. Nginx本地缓存6.1 本地缓存API6.2 实现本地缓存查询 7. …