接口

作者: simon_李玉兵 | 来源:发表于2021-03-01 16:17 被阅读0次

接口就是用代码描述一个对象必须有什么属性(包括方法),但是有没有其他属性就不管了

interface LabelledValue {
  label: string;
}

function printLabel(labelledObj: LabelledValue) {
  console.log(labelledObj.label);
}
// 我们传入的对象参数实际上会包含很多属性,但是编译器只会检查那些必需的属性是否存在,并且其类型是否匹配。
let myObj = {size: 10, label: "Size 10 Object"}; 
printLabel(myObj);

对象字面量会被特殊对待而且会经过 额外属性检查
如果一个对象字面量存在任何“目标类型”不包含的属性时,你会得到一个错误

interface LabelledValue {
  label: string;
}

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

printLabel( {size: 10, label: "Size 10 Object"}); // 会报错

绕开这些检查非常简单。 最简便的方法是使用类型断言:

printLabel( {size: 10, label: "Size 10 Object"} as LabelledValue);

或者添加一个字符串索引签名

interface LabelledValue {
  label: string;
  [propName: string]: any; //这我们要表示的是LabelledValue可以有任意数量的属性
}
可选属性
interface SquareConfig {
  color?: string;
  width?: number;
}
只读属性
interface Point {
    readonly x: number;
    readonly y: number;
}
let p1: Point = { x: 10, y: 20 };
p1.x = 5; // error!

TypeScript具有ReadonlyArray<T>类型,它与Array<T>相似,只是把所有可变方法去掉了,因此可以确保数组创建后再也不能被修改:

let a: number[] = [1, 2, 3, 4];
let ro: ReadonlyArray<number> = a;
ro[0] = 12; // error!
ro.push(5); // error!
ro.length = 100; // error!
a = ro; // error!

接口描述函数类型

interface SearchFunc {
  (source: string, subString: string): boolean;
}

let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
  let result = source.search(subString);
  return result > -1;
}

当函数类型有属性时


微信图片_20210224165232.png

类类型

TypeScript也能够用它来明确的强制一个去符合某种契约

interface ClockInterface {
    currentTime: Date;
}

class Clock implements ClockInterface {
    currentTime: Date; // 类必须含有currentTime属性
    constructor(h: number, m: number) { }
}

继承接口

interface Animal {
  move():void;
}
interface Human extends Animal { // 可继承多个,用逗号分隔
  name: string;
  age: number;
}
let simon: Human = {
  name: 'simon',
  age: 19,
  move() {
    console.log('我在动')
  }
}
simon.move() // 我在动

相关文章

  • 接口接口接口

    发现很多朋友对于接口都很纠结,阐述一下个人对接口的理解。 接口分为很多种类型,程序语言内部接口 移动端和服务端接口...

  • Android常用接口

    不知名接口 头条接口: 科技接口: 财经接口: 军事接口: 体育接口: 房产接口: 足球接口: 娱乐接口: 电影接...

  • 第十八天 微信微博天气接口

    分享接口 微信接口 微博接口 天气接口 mob接口

  • 接口测试概述

    接口(interface)的概念 常见接口名词 接口测试: 接口测试目的: 接口测试的重要性: 接口测试流程 接口...

  • 接口测试

    接口测试概念: 接口:接口是为了提供一种服务 所有的接口统称为API,接口分为内部接口和外部接口 外部接口:测试被...

  • 接口

    接口 接口类型 空接口 接口嵌套 接口断言 type关键字

  • 线程池原理

    Callable 接口 Runnable 接口 Future接口 RunnableFuture 接口 Future...

  • JMeter-一个接口的返回值作为输入传给其他接口

    背景: 在用JMeter写接口case,遇到一种情况,接口1查看列表接口,接口2查看详情接口,接口2需要传入接口1...

  • 用户操作接口

    登陆 接口地址 获取列表 接口地址 删除 接口地址 批量删除 接口地址 编辑用户 接口地址 添加用户 接口地址

  • JAVA中的集合框架 List (二)

    Collection接口List接口简介 Collection接口、子接口及其实现类,Collection接口是j...

网友评论

      本文标题:接口

      本文链接:https://www.haomeiwen.com/subject/seusfltx.html