TypeSript2 接口类型interface

server/2024/10/9 7:56:54/

接口对象的类型

typescript中,我们定义对象的方式要用关键字interface(接口),我的理解是使用interface来定义一种约束,让数据的结构满足约束的格式。

主要是以下特性

interface接口类型 常用于定义对象 比较两个对象形状是否一致

1.对比形状

//这样写是会报错的 因为我们在person定义了a,b但是对象里面缺少b属性
//使用接口约束的时候不能多一个属性也不能少一个属性
//必须与接口保持一致
interface Person {
    b:string,
    a:string
}
 
const person:Person  = {
    a:"213"
}

2. 重合

interface face1 {

  name: string;

}

interface face1 {

  age: number;

}

let a1: face1 = {

  name: "xx",

  age: 20,

}

3. 任意key 索引签名[propName: string]: any; 不确定后端会传是什么类型 最好使用any

interface face1 {

  name: string;

  [propName: string]: any;

}

let a5: face1 = {

  name: "xx",

  age: 20,

  c: 123,

};

3 ? readeOnly ?是可选的后端可能不传这个值 readeOnly是只读不能改常用于后端的id 及函数

interface face1 {

  name: string;

  age?: number;

  readonly id:number

  readonly cb:()=>boolean

}

let a1: face1 = {

  id:1,

  name: "xx",

  cb:()=>{

    return false

  }

}

a1.cb=()=>{ // 函数被修改了 不期望被修改

  return true

}

 

4 接口继承 extends

interface face1 extends face2 {

  name: string;

}

interface face2 {

  age: number;

}

let a1: face1 = {

  name: "xx",

  age: 20,

};

5 接口定义函数类型

interface Person {
    b?: string,
    readonly a: string,
    [propName: string]: any;
    cb:()=>void
}
 
const person: Person = {
    a: "213",
    c: "123",
    cb:()=>{
        console.log(123)
    }
}

TypeSript3 数组类型-CSDN博客 


http://www.ppmy.cn/server/106628.html

相关文章

OpenCV c++ 实现图像马赛克效果

VS2022配置OpenCV环境 关于OpenCV在VS2022上配置的教程可以参考:VS2022 配置OpenCV开发环境详细教程 图像马赛克 图像马赛克(Image Mosaic)的原理基于将图像的特定区域替换为像素块,这些像素块可以是纯色或者平均色&#xff0c…

保持异步同步:SmartBear利用事件驱动架构

开发团队需要保持竞争力,API 从业者正在使用各种协议来完成工作。总是有新出现的方法、协议和框架来满足业务需求。我们的软件质量状况 | 2023 年 API 工具和趋势报告发现,不仅微服务在增加,我们还看到支持事件和消息传递的 API 也在增加。此…

目标检测:Cascade R-CNN: Delving into High Quality Object Detection - 2017【方法解读】

查看新版本论文:目标检测:Cascade R-CNN: High Quality Object Detection and Instance Segmentation - 2019【方法解读】 目录 摘要:1.引言2. 相关工作3. 对象检测3.1. 边界框回归3.2. 分类3.3. 检测质量4. 级联 R - CNN4.1. 级联边界框回归4.2. 级联检测摘要: 在目标检测…

这几天旅游去了,刚回来,有几点感想

这几天旅游去了,刚回来,有几点感想: 一、不要抱怨外部环境差,你无法适应,不代表别人无法适应 从疫情开始,就一直有一个声音,抱怨说自己不赚钱是因为外部环境差,有理由可以摆烂了。…

【C#】【EXCEL】BumblebeeComponentsAnalysisGH_Ex_Ana_SparkColumn.cs

这段代码定义了一个名为 GH_Ex_Ana_SparkColumn 的 Grasshopper 组件,其主要功能是在 Excel 工作表中添加迷你图列(Sparkline Column)。以下是对这个组件的功能和特点的详细介绍: 功能概述: 这个组件允许用户在 Grassh…

谷粒商城实战笔记-249-商城业务-消息队列-RabbitMQ工作流程

文章目录 一,基本概念二,消息从producer到consumer的过程 一,基本概念 RabbitMQ是一个流行的开源消息代理软件,它实现了高级消息队列协议(AMQP)。以下是RabbitMQ的一些基本概念: Broker&#x…

92.WEB渗透测试-信息收集-Google语法(6)

免责声明:内容仅供学习参考,请合法利用知识,禁止进行违法犯罪活动! 内容参考于: 易锦网校会员专享课 上一个内容:91.WEB渗透测试-信息收集-Google语法(5) 监控的漏洞也有很多 打…

python从入门到精通:异常操作、模块操作及包操作

目录 1、异常概念 2、异常的捕获方法 3、异常的传递 4、python模块 4.1、模块的导入 4.2、自定义模块 5、python包 5.1、自定义python包 5.2、安装第三方包 1、异常概念 当检测到一个错误时,python解释器会无法执行,反而出现一些错误的提示&a…