TypeScript接口(Interfaces)来定义对象的类型

时间: 2019-05-13阅读: 1178标签: 接口

1. 在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。


2. 在面向对象语言中,接口(Interfaces)是一个很重要的概念,它是对行为的抽象,而具体如何行动需要由类(classes)去实现(implements)

interface Person {
    name: string;
    age: number;
}

let tom:Person {
    name: 'tom',
    age: 18
}

变量tom是接口Person数据类型,则tom的所有属性必须与Person相同,无论是属性名还是属性值的数据类型,不能多也不能少必须完全一致


3. 可选属性

interface Person {
    name: string;
    age?: number;
}
let tom:Person {
    name: 'tom'
}

可选属性的含义是该属性可以不存在,但仍然不允许添加不存在的属性


4. 任意属性

接口中一旦定义了任意属性,那么接口中的可选属性和确定属性的必须是任意属性的子属性  

interface Person {
    name: string;
    age?: number;
    [propName:string]: any;
}
// A.
let tom:Person {
    name: 'tom',
    gender: 'male'
}
// B.
let tom:Person {
    name: 'tom',
    age: 12,
    gender: 'male'
}

B会报错,因为任意属性gender是string类型, number 不是 string 的子属性,所以会报错


5. 只读属性

只读属性是只该字段只在创建的时候被赋值,它的约束力在于第一次给对象赋值的时候,并非是第一次给只读属性赋值的时候  

interface Person {
    name: string;
    readonly age: number;
    gender?: string;
}
let tom:Person {
    name: 'tom',
    age: 12,
    gender: 'male'
}
tom.age = 15;  // 报错
//  age属性只能在对象赋值时赋值。


let tom:Person {
    name: 'tom'
}  // 错  age为确定属性,赋值时必须包含此属性
tom.age = 12;  // 错,age为只读属性,只有第一次对象赋值时才能赋值
站长推荐

1.阿里云: 本站目前使用的是阿里云主机,安全/可靠/稳定。点击领取2000元代金券、了解最新阿里云产品的各种优惠活动点击进入

2.腾讯云: 提供云服务器、云数据库、云存储、视频与CDN、域名等服务。腾讯云各类产品的最新活动,优惠券领取点击进入

3.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/3309

浅谈JavaScript中的接口

接口是面向对象JavaScript程序员的工具箱中最有用的工具之一。在设计模式中提出的可重用的面向对象设计的原则之一就是“针对接口编程而不是实现编程”,即我们所说的面向接口编程,这个概念的重要性可见一斑。

关于使用Promise/async await解决循环请求接口的问题

我有一组list,包含了所有的预定id,现在我需要循环这组id去请求一个接口,以获取详情信息.这里需要注意的点是:我需要的信息并不是一个接口可以请求完的,而是需要循环请求接口

TypeScript中的接口

TypeScript的核心原则之一是对值所具有的结构进行类型检查。 它有时被称做“鸭式辨型法”或“结构性子类型化”。 在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约

nodejs接口如何限流?

在开发高并发系统时,有三把利器用来保护系统:缓存、降级和限流。那么何为限流呢?顾名思义,限流就是限制流量,就像你宽带包了1个G的流量,用完了就没了。通过限流,我们可以很好地控制系统的qps,从而达到保护系统的目的

ts中接口的用法

属性接口:接口中可定义 确定属性、可选属性、任意属性、只读属性;只读属性也是确定属性,在对象变量定义的时候必须有值,此后不能修改、函数接口对方法传入的参数以及返回值进行约束

JSON API免费接口

各种提供JSON格式数据返回服务网站的API接口,为大家搜集了一些能够返回JSON格式的服务接口。部分需要用JSONP调用。

Mock.js模拟接口数据

现在开发已经是前后端分离了,前端和后端可以同时进行开发,互不影响,但是有些时候后端开发的接口慢于前端,导致前端需要等待后端的接口完成才能完成前后端对接,为了解决这个痛点,出现了模拟接口数据的方案

接口

接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范,接口不关心这些类的内部状态数据

vue项目用到的mock数据接口的两种方式

使用devServer.before进行数据mock,通过配置devServer.before选项,设置url访问路径及response响应数据,进行mock数据。使用Mock.js进行数据mock根据数据模板生成模拟数据。

如何使用 React hooks 获取 api 接口数据

在本教程中,我想向你展示如何使用 state 和 effect 钩子在React中获取数据。 你还将实现自定义的 hooks 来获取数据,可以在应用程序的任何位置重用,也可以作为独立节点包在npm上发布。

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!

文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全运营推广