typeScript基础(5)_对象的类型-interfaces接口

接口类型

使用interfaces来给对象定义类型，接口interfaces是对行为的抽象，而具体如何行动需要类来实现implement。

TypeScript 中的接口是一个非常灵活的概念，除了可用于对类的一部分行为进行抽象以外，也常用于对「对象的形状（Shape）」进行描述。

For example ：

接口简单使用

//接口简单使用
interface MySelf {name: string,age: number,habby: number[],runing?: boolean,//可选参数
}var obj: MySelf = {name: "zjq",age: 18,habby: [1, 2, 3]
}
var obj: MySelf = {name: "zjq",age: 18,habby: [1, 2, 3],runing:true
}

给obj赋值了MySelf 类型，里面可以对三个属性进行了约束，另外一个runing是可选属性，用的话必须是布尔类型才可以。

自定义属性

//自定义属性
interface NewMySelf {name: string,age: number,habby: number[],runing?: boolean,//可选参数[propName: string]: string | boolean | number | number[] //需要包含上述所有类型  使用联合类型  |
}
var newmyself: NewMySelf = {name: "zjq",age: 18,habby: [1, 2, 3, 4],runing: true,zjq: 'zjjq',zrh: "888"
}

[propName: string]: string | boolean | number | number[] //需要包含上述所有类型使用联合类型 |

只读属性：readonly

interface ReadonlyS {readonly name: string,age: number,habby: number[],runing?: boolean,//可选参数[propName: string]: string | boolean | number | number[] //需要包含上述所以类型  使用联合类型  |
}
//添加readonly后，首次声明变量时没加name属性也会报错。
var shop: ReadonlyS = {name: "zjq",age: 18,habby: [1, 2, 3, 4],runing: true,zjq: 'zjjq',
}
// shop.name = '000'   //会报错提示  是只读属性 。

只读属性只能在第一次给ReadonlyS 类型的对象赋值时就给定name属性，否则就会报错，再次添加属性赋值也会报错。

总结：innterfaces是为了规范对象的参数，可以规定对象的必有属性、可选属性、自定义属性、只读属性。

参考：https://www.bookstack.cn/read/typescript-tutorial-202005/basics-type-of-object-interfaces.md

typeScript基础(5)_对象的类型-interfaces接口相关推荐

typeScript复杂数据类型--任意类型、类型推论、联合类型、对象的类型（接口）、数组的类型、函数的类型
目录 1.任意值什么是任意值类型未声明类型的变量 2.类型推论 3. 联合类型访问联合类型的属性或方法 4.对象的类型--接口什么是接口可选属性任意属性只读属性 1.任意值任意值(An ...
typeScript基础(1)_原始数据类型学习
typeScript系列将是学习ts的一些笔记,主要是为了以后及时的的回顾. 这个系列将会根据TypeScript 入门教程(202005)配合学习. 在这之前,我们需要先安装 npm install ...
vue实现数据双向绑定的基础之理解对象属性类型
原生JavaScript之理解对象 ECMA-262 把对象定义为:"无序属性的集合,其属性可以包含基本值.对象或者函数."严格来讲, 这就相当于说对象是一组没有特定顺序的值.对象 ...
【TS】在 TypeScript 中，我们使用接口（Interfaces）来定义对象的类型
一.什么是接口在 TypeScript 中,我们使用接口Interfaces来定义对象的类型. 可以用来约束一个对象,函数,以及类的结构和类型. 在面向对象语言中,接口Interfaces是一个很重 ...
TypeScript基础入门 - 接口 - 可索引的类型
转载地址 TypeScript基础入门 - 接口 - 可索引的类型项目实践仓库 https://github.com/durban89/typescript_demo.git tag: 1.0.11 ...
TypeScript 基础类型 1
TypeScript 基础类型自本节起,我们将开始接触 TypeScript 的类型系统,这也是 TypeScript 最为核心的部分. 本节介绍 TypeScript 中一些基础类型,有些特殊类型 ...
[基础] AHK函数对象初窥 ① _实例2_实际可用版
[基础] AHK函数对象初窥 ① _实例2_实际可用版 ;# 母文章 https://zhuanlan.zhihu.com/p/48977298;;;;;;;;;;;;;;;;;;;;;;;;;;;; ...
TypeScript基础入门之高级类型的可辨识联合（Discriminated Unions）
2019独角兽企业重金招聘Python工程师标准>>> 转发 TypeScript基础入门之高级类型的可辨识联合(Discriminated Unions) 高级类型可辨识联合(D ...
TypeScript基础之typeof 类型操作符
前言文中内容都是参考https://www.typescriptlang.org/docs/handbook/2/typeof-types.html , 以及参考 TypeScript 之 Type ...