首页 > 其他分享 >TypeScript:接口

TypeScript:接口

时间:2023-04-27 09:00:59浏览次数:47  
标签:TypeScript color number 接口 width config 属性

介绍

TypeScript的核心原则之一是对值所有的结构类型进行类型检查。在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义约束。

接口的基本使用

interface LabelledValue {
  label: string;
}

function printLabel(labelledObj: LabelledValue) {
  console.log(labelledObj.label);
}

let myObj = { size: 10, label: 'Size 10 Object' };
printLabel(myObj);

可选属性

接口里的属性不全都是必须的。有些只是在某些条件下存在,或者根本不存在。可选属性在给函数传入的参数对象中只有部分属性赋值时很常用.

  • 可选属性使用?:表示
interface SquareConfig {
  color?:string;
  width?: number;
}

示例

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): { color: string; area: number } {
  let newSquare = { color: 'white', area: 100 };
  if (config.color) {
    newSquare.color = config.color;
  }

  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}

let mySquare = createSquare({ color: 'black' });

只读属性

一些对象属性只能在对象刚刚创建的时候修改器值,你可以再属性名前用readonly来指定只读属性:

interface Point {
    readonly x: number;
    readonly y: number;
}

参考链接

https://www.tslang.cn/docs/handbook/interfaces.html

标签:TypeScript,color,number,接口,width,config,属性
From: https://www.cnblogs.com/leoych/p/17356351.html

相关文章

  • 后端整合 Swagger + Knife4j 接口文档
    接口文档:个人理解的就是后端提供给前端,供前端查看了解数据结构,是前后端联调的基础。Swagger+Knife4j:引入依赖:<!--添加swagger的依赖--><dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-spring-boot-s......
  • struts1 PlugIn接口
    Struts1提供PlugIn接口,可以动态增减ActionServlet的功能。如果需要在应用启动或关闭时完成某些操作,可以创建自己的PlugIn类。Java代码:packagecom.struts1.plugin;importjavax.servlet.ServletException;importorg.apache.struts.action.ActionServlet;importorg.apache.st......
  • 小D-新版接口自动化教程-实操
    setUptearDown TestSuite ......
  • 数据库查询与前台请求后台接口返回结果id的值不一致
    数据库查询与前台请求后台接口返回结果id的值不一致主要是主键ID类似于时间戳的那种形式,前端获取接口返回后,最后几位变成了0了,网上搜了下,还有不少人也出现过这种情况。解决办法就是后台返回这个id,改成字符串类型,原因可能是int或者long在前端长度不够导致   ......
  • [译]在C#中使用IComparable和IComparer接口
    原文:UsetheIComparableandIComparerinterfacesinVisualCSharp本文介绍了在VisualC#中如何使用IComparer和IComparable接口。概要本文同时讨论了IComparable和IComparer接口,原因有两点。这两个接口经常一起使用。虽然接口类似且名称相似,但它们却有不同的用途。如果你......
  • 淘宝API接口趋势
    近年来,淘宝API接口的使用量逐年增长,主要是因为越来越多的开发者和企业希望通过淘宝API接口来访问淘宝的商品、订单、用户等数据,从而实现各种商业化和项目化的应用。目前,淘宝API接口的使用范围已经涵盖了电商、社交、金融、医疗、教育等多个领域,是当今互联网应用中不可或缺的重要组......
  • Java中抽象类和接口的区别?
    什么是抽象类?抽象类是对具体概念的抽象抽象类本质是为了继承只能被public或默认修饰行为层面抽象出来抽象方法抽象类的注意事项抽象类不可以被直接实例化抽象类中可以存在构造方法抽象类可以存在普通方法抽象方法的注意抽象方法必须定义在抽象类中仅声明实现......
  • 关于使用tcpdump命令抓包时网络接口的查询与指定
    第一步:首先可以通过tcpdump命令的--list-interfaces选项,列出系统中的所有网络接口(这个与ipaddr列出的还有略有点点差异)-D--list-interfacesPrintthelistofthenetworkinterfacesavailableonthesystemandonwhichtcpdumpcancapturepackets.......
  • Spring注入接口,接口多个实现类调用哪个实现类的三种方案
    https://blog.csdn.net/JingXu1114/article/details/124747047代码所示:···@AutowiredUserServiceuserService···在这个接口有多个实现类的情况下三种方式定义调用实现类:方法1:···`@Autowired UserServiceuserServiceImpl_1`···在变量名中直接写成想要调用......
  • Geoserver使用rest接口发布图层
    Geoserver提供一系列rest接口,发布图层也可以通过rest接口进行图层发布接口post请求/rest/workspaces/{workspaceName}/datastores/{storeName}/featuretypes请求参数(主要参数)参数类型描述必填workspaceNamestring工作空间truestoreNamestring储存仓库t......