TS学习02-接口

接口

ts原则之一就是对值所具有的结构进行类型检查。

结构的左右就是为了这些类型命名和代码定义契约

interface LabelValue {label: string
}
function point(label: LabelValue) {}
let obj = {label:'标题',age: 18}
point(obj)

类型检查器不会去检查属性的顺序,只要相应的属性存在并且类型也是对的就可以

可选属性

在可选属性名字定义的后面加一个?符号

  • 可选属性的好处之一是可以对可能存在的属性进行预定义
  • 好处之二是可以捕获引用了不存在的属性时的错误。
Interface Pint {x?:number}

只读属性

在属性名前用 readonly来指定只读属性

Interface Point{readonly x: number}
let x: Point = {x: 100}
x.x = 6 //error

ReadonlyArray

Array<T>类似,可确保数组创建后就不可修改

let arr: ReadonlyArray<any> = [1,'f']
arr[0] //error

可以通过类型断言改变上面的检查

let a = arr as Array<ant>

readonly VS const

作为变量使用:用const

作为属性使用:用readonly

额外的属性检查

对象字面量会被特殊对待而且会经过 额外属性检查,当赋值给变量作为参数传递的时候

interface Point {name:'Ren'
}
let point: Point = {name: 'Ren', age:18}//编译报错
console.log(point,'var')
function fun(point: Point) {console.log(point,'fun')
}
fun({name: 'Ren', age:18})//编译爆粗

通过检查的方法

  • 类型断言
fun({name:'Ren', age: 18} as Point) 
  • 添加字符串索引签名
interface Point {name: string;[propName:string]: any
}
  • 将他赋值给一个变量
let aa = {name: 'Ren', age:18}
let point: Point = aa
fun(aa)//编译爆粗

因为不会经过额外属性检查,所以编译器不会报错

函数类型

interface SearchFun {(source: string,  subString: string): boolean;
}
let fun:searchFun = (a:string, b:string):boolean {return false}

函数的参数名不需要与接口里定义的名字相匹配

如果你不想指定类型,TypeScript的类型系统会推断出参数类型

可索引类型

描述那些能够“通过索引得到”的类型

可索引类型具有一个 索引签名

intreface StringArray {[index: number]: string
}
let myArray: StringArray = ['bob', 'fire']
let mystr: string = myArray[0]

TypeScript支持两种索引签名:字符串和数字。

可以同时使用两种类型的索引,但是数字索引的返回值必须是字符串索引返回值类型的子类型。 这是因为当使用 number来索引时,JavaScript会将它转换成string然后再去索引对象。 也就是说用 100(一个number)去索引等同于使用"100"(一个string)去索引,因此两者需要保持一致。

类类型

实现接口

insterface ClockInterface{currentTime: Date}
class Clock implements ClockInterface {currentTime: Date}

在接口中描述方法

interface ClockInterface {setTime(d: Date)
}
class Clock implements ClockInterface {currentTime: Date;setTime(d: date) {this.currentTime = d}
}

类静态部分与实例部分的区别

只对实例部分进行类型检查。

constructor存在于类的静态部分,所以不在检查的范围内。

当用构造器签名去定义一个接口,并试图定义一个类区是想这个接口时,报错

interface ClockInterface {new (hour: number, minute: number)}
class Clock implements ClockInterface {constructor (h: number, m: number) {}
}
//报错

请直接操作类的静态部分。

构造函数签名

interface ClockConstructor {new (hour: number, minute: number): ClockInterface;
}
function createClock(ctor: ClockConstructor, hour: number, minute: number): ClockInterface {return new ctor(hour, minute);
}
createClock(DigitalClock, 12, 17);

会坚持 DigitalClock参数是否符合构造函数墙面

继承和接口

接口也可以相互继承

interface Shape {color: string}
interface Square extends Shape {sildLength: number}
let square = <Square>()
square.color = 'blue'

一个接口可继承多个接口

interface PenStorke {penWindth: number}
interface Square extends Shape, PenStorke {sideLength: number}
let square = <Square>{};
square.penWidth = 5.0;

混合类型

对象可以同时具有多种类型。如:

interface Counter {(start: number) : string;interval: number;reset() : void
}
function getCounter() :Counter {let counter = <Counter>function(start:number) {}counter.interval = 123;counter.reset = function() {}
}
let c = getCounter();c(10)c.reset()c.intervalue = 5.0

接口继承类

接口继承类类型时,会继承类的成员但不包括其实例。也会继承到类的private 和 protected 成员。

这意味着当你创建了一个接口继承了一个拥有私有或受保护的成员的类时,这个接口类型只能被这个类或其子类所实现(implement)。

class A {prevate state: any}//类
interface Point extends A {select(): valid}//接口继承类
class B extends A implements Point {select() {}}//子类实现接口
class C extends extends Control {select() {}}#错误-接口继承了父类公共/私有/保护的成员,非子类无法实现接口
class D implements Point{}

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

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

相关文章

Go重写Redis中间件 - Go实现Redis集群

Go实现Redis集群 这章的内容是将我们之前实现的单机版的Redis扩充成集群版,给Redis增加集群功能,在增加集群功能之前,我们先学习一下在分布式系统中引用非常广泛的技术一致性哈希,一致性哈希在我们项目里就应用在我们Redis集群的搭建这块 详解一致性哈希 Redis集群需求背…

服务器杂七杂八的知识/常识归纳(不断更新)

一.pID与端口号不一样吗? pID&#xff08;Process ID&#xff0c;进程标识符&#xff09;和端口号是不同的概念。 pID是操作系统中用来唯一标识一个正在运行的进程的数字。每个正在运行的进程都会被分配一个唯一的pID&#xff0c;它可以用来追踪和管理进程。 而端口号是在网…

实际工作中通过python+go-cqhttp+selenium实现自动检测维护升级并发送QQ通知消息(程序内测)

说明&#xff1a;该篇博客是博主一字一码编写的&#xff0c;实属不易&#xff0c;请尊重原创&#xff0c;谢谢大家&#xff01; 首先&#xff0c;今年比较忙没有多余时间去实操创作分享文章给大家&#xff0c;那就给大家分享下博主在实际工作中的一点点内容吧&#xff0c;就当交…

Leetcode.1749 任意子数组和的绝对值的最大值

题目链接 Leetcode.1749 任意子数组和的绝对值的最大值 rating : 1542 题目描述 给你一个整数数组 n u m s nums nums 。一个子数组 [ n u m s l , n u m s l 1 , . . . , n u m s r − 1 , n u m s r ] [numsl, numsl1, ..., numsr-1, numsr] [numsl,numsl1,...,numsr−1,…

mysql支持的xa具体指的是什么?

在MySQL中&#xff0c;XA指的是一种事务协议&#xff08;eXtended Architecture&#xff09;&#xff0c;用于支持分布式事务。XA协议允许应用程序跨多个独立的数据库资源&#xff08;例如多个MySQL实例&#xff09;执行分布式事务。 具体来说&#xff0c;XA协议提供了以下关键…

mongoose 解析接口参数

http://127.0.0.1:3003/gt?duration[lte]4 mongoose 查询 lt 小于 lte 小于等于 gt 大于 gte 这些参数可以放在链接里面 let re await M.find(req.query); //method 1let queryObj JSON.stringify(req.query).replace(/\b(lt|lte|gt|gte)\b/g, (match) > $${matc…

容器安全的常见风险与防护实践

运行在云平台上的容器产品&#xff0c;因为具备一个完整的可移植应用程序环境&#xff0c;能够帮助用户轻松地完成对应用程序的开关控制&#xff0c;提升应用程序的敏捷性&#xff0c;同时节约企业的IT建设成本。在巨大优势作用下&#xff0c;容器产品的采用率在2021年达到了新…

小研究 - Mysql快速全同步复制技术的设计和应用(三)

Mysql半同步复制技术在高性能的数据管理中被广泛采用&#xff0c;但它在可靠性方面却存在不足.本文对半同步复制技术进行优化&#xff0c;提出了一种快速全同步复制技术&#xff0c;通过对半同步数据复制过程中的事务流程设置、线程资源合理应用、批量日志应用等技术手段&#…

全栈测试平台推荐:RunnerGo

做软件测试的同学在工作时应该都碰到过这种情况&#xff1a;接口管理、接口测试用postman、Apipost等接口管理工具&#xff0c;性能测试用jmeter、loadrunner等性能测试工具&#xff0c;接口自动化则是jmeter脚本或者python脚本配合jenkins使用。这种情况极大的降低了研发效率&…

RedisTemplate.opsForList()用法简介并举例

RedisTemplate.opsForList()是RedisTemplate类提供的用于操作List类型的方法。它可以用于对Redis中的List数据结构进行各种操作&#xff0c;如添加元素、获取元素、删除元素等。 下面是一些常用的RedisTemplate.opsForList()方法及其用法示例&#xff1a; leftPush&#xff1…

Linux下的环境变量

目录 一、环境变量是什么&#xff1f;二、常见的环境变量三、查看环境变量的方法四、和环境变量相关的命令五、命令行参数五、环境变量通常是具有全局属性的 一、环境变量是什么&#xff1f; 环境变量通俗来说就是一种存储系统和应用程序运行需要的配置信息的方式。可以把环境…

MySQL数据库基础

目标&#xff1a; 1.数据库操作&#xff1a;创建数据库&#xff0c;删除数据库 2.常用数据类型 3.表的操作&#xff1a;创建表&#xff0c;删除表 数据库操作 &#xff08;1&#xff09;显示数据库 show databases&#xff1b; &#xff08;2&#xff09;创建数据库 创建一个…

Playwright 和 Selenium 的区别是什么?

前言 最近有不少同学问到 Playwright 和 Selenium 的区别是什么&#xff1f; 有同学可能之前学过 selenium 了&#xff0c;再学一个 playwright 感觉有些多余&#xff0c;可能之前有项目已经是 selenium 写的了&#xff0c;换成 playwright 需要时间成本&#xff0c;并且可能有…

算法的时间复杂度和空间复杂度

目录 前言&#xff1a; ✨什么是数据结构&#xff1f; ✨ 什么是算法&#xff1f; ✨数据结构和算法的重要性 &#x1f351;算法的时间复杂度和空间复杂度 算法效率 &#x1f389;时间复杂度 2.1 时间复杂度的概念 2.2 大O的渐进表示法 &#x1f389;空间复杂度 前言&#xf…

P1908 逆序对

逆序对 题目描述 猫猫 TOM 和小老鼠 JERRY 最近又较量上了&#xff0c;但是毕竟都是成年人&#xff0c;他们已经不喜欢再玩那种你追我赶的游戏&#xff0c;现在他们喜欢玩统计。 最近&#xff0c;TOM 老猫查阅到一个人类称之为“逆序对”的东西&#xff0c;这东西是这样定义…

Linux中安装jdk

Linux中安装jdk 操作步骤: 1、使用FinalShell自带的上传工具将jdk的二进制发布包上传到Linux 2、解压安装包&#xff0c;命令为tar -zxvf jdk-8u171-linux-x64.tar.gz -C/usr/local 3、配置环境变量&#xff0c;使用vim命令修改/etc/profile文件&#xff0c;在文件末尾加入如…

排序算法(九大)- C++实现

目录 基数排序 快速排序 Hoare版本&#xff08;单趟&#xff09; 快速排序优化 三数取中 小区间优化 挖坑法&#xff08;单趟&#xff09; 前后指针法&#xff08;单趟&#xff09; 非递归实现&#xff08;快排&#xff09; 归并排序 非递归实现&#xff08;归并&am…

2、简单上手+el挂载点+v-xx(v-text、v-html、v-on、v-show、v-if、v-bind、v-for)

官网&#xff1a; vue3&#xff1a;https://cn.vuejs.org/ vue2&#xff1a;https://v2.cn.vuejs.org/v2/guide/ 简单上手&#xff1a; 流程&#xff1a; 导入开发版本的Vue.js <!--开发环境版本&#xff0c;包含了有帮助的命令行警告--> <script src"https…

何时使用Elasticsearch而不是MySql

MySQL 和 Elasticsearch 是两种不同的数据管理系统&#xff0c;它们各有优劣&#xff0c;适用于不同的场景。本文将从以下几个方面对它们进行比较和分析&#xff1a; 数据模型 查询语言 索引和搜索 分布式和高可用 性能和扩展性 使用场景 数据模型 MySQL 是一个关系型数…

单片机开发 esp8266

一、固件界面 二、项目介绍 固件名称&#xff1a;esp8266-universalboard v1.0 提供商&#xff1a; 半条虫(466814195) 下载&#xff1a;esp8266-universalboard.bin 源码地址&#xff1a;Gitlab