TypeScript基础入门 - 接口 - 可索引的类型
转载地址
TypeScript基础入门 - 接口 - 可索引的类型
项目实践仓库
https://github.com/durban89/typescript_demo.git
tag: 1.0.11
为了保证后面的学习演示需要安装下ts-node,这样后面的每个操作都能直接运行看到输出的结果。
npm install -D ts-node
后面自己在练习的时候可以这样使用
npx ts-node src/learn_basic_types.ts
npx ts-node 脚本路径
接口
TypeScript的核心原则之一是对值所具有的结构进行类型检查。 它有时被称做“鸭式辨型法”或“结构性子类型化”。 在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。
可索引的类型
与使用接口描述函数类型差不多,我们也可以描述那些能够“通过索引得到”的类型,比如a[10]或ageMap["daniel"]。 可索引类型具有一个 索引签名,它描述了对象索引的类型,还有相应的索引返回值类型。 让我们看一个例子:
interface SomeArray {[index: number]: string;
}let someArray: SomeArray;
someArray = ["string1", "string2"];let str: string = someArray[0];
console.log(str);
运行后结果如下
string1
上面例子里,我们定义了SomeArray接口,它具有索引签名。 这个索引签名表示了当用 number去索引SomeArray时会得到string类型的返回值。共有支持两种索引签名:字符串和数字。 可以同时使用两种类型的索引,但是数字索引的返回值必须是字符串索引返回值类型的子类型。 这是因为当使用 number来索引时,JavaScript会将它转换成string然后再去索引对象。 也就是说用 100(一个number)去索引等同于使用"100"(一个string)去索引,因此两者需要保持一致。
class Person {name: string;
}
class Student extends Person {className: string;
}// 错误:使用数值型的字符串索引,有时会得到完全不同的Person!
interface NotOkay {// [x: number]: Person; // 数字索引类型“Person”不能赋给字符串索引类型“Student”[x: string]: Student;
}
字符串索引签名能够很好的描述dictionary模式,并且它们也会确保所有属性与其返回值类型相匹配。 因为字符串索引声明了 obj.property和obj["property"]两种形式都可以。 下面的例子里, name的类型与字符串索引类型不匹配,所以类型检查器给出一个错误提示:
interface SomeInterface {[index: string]: string// length: number // 错误,`length`的类型与索引类型返回值的类型不匹配name: string // 可以,name是string类型
}
最后,你可以将索引签名设置为只读,这样就防止了给索引赋值:
interface SomeInterface {[index: string]: string// length: number // 错误,`length`的类型与索引类型返回值的类型不匹配name: string // 可以,name是string类型
}interface ReadonlySomeArray {readonly [index: number]: string;
}
let readonlyArray: ReadonlySomeArray = ["string1", "string2"];
readonlyArray[2] = "string3"; // error!
运行后会得到如下错误提示
src/interface_6.ts(36,1): error TS2542: Index signature in type 'ReadonlySomeArray' only permits reading.
你不能设置readonlyArray[2],因为索引签名是只读的。
本实例结束实践项目地址
https://github.com/durban89/typescript_demo.git
tag: 1.0.12
TypeScript基础入门 - 接口 - 可索引的类型相关推荐
- TypeScript基础入门 - 接口 - 继承接口
转载地址 TypeScript基础入门 - 接口 - 继承接口 项目实践仓库 https://github.com/durban89/typescript_demo.git tag: 1.0.13 为 ...
- TypeScript基础入门 - 接口 - 简介
转载地址 TypeScript基础入门 - 接口 - 简介 项目实践仓库 https://github.com/durban89/typescript_demo.git tag: 1.0.6 为了保证 ...
- TypeScript基础入门 - 接口 - 可选属性
2019独角兽企业重金招聘Python工程师标准>>> 转载地址 TypeScript基础入门 - 接口 - 可选属性 项目实践仓库 https://github.com/durba ...
- TypeScript基础入门之高级类型的可辨识联合(Discriminated Unions)
2019独角兽企业重金招聘Python工程师标准>>> 转发 TypeScript基础入门之高级类型的可辨识联合(Discriminated Unions) 高级类型 可辨识联合(D ...
- TypeScript基础入门 - 泛型 - 泛型类型
2019独角兽企业重金招聘Python工程师标准>>> 转载 TypeScript基础入门 - 泛型 - 泛型类型 项目实践仓库 https://github.com/durban8 ...
- TypeScript基础入门 - 函数 - 简介
2019独角兽企业重金招聘Python工程师标准>>> 转载 TypeScript基础入门 - 函数 - 简介 项目实践仓库 https://github.com/durban89/ ...
- TypeScript基础入门
目录 本文概览: 1. TypeScript的特点 2. TypeScript的安装与使用 (1)项目初始化 (2)配置TSLint 本文概览: 1. TypeScript的特点 TypeScript ...
- 变量的三重属性_TypeScript基础入门 - 变量声明(三)
转载地址TypeScript基础入门 - 变量声明(三)www.gowhich.com 项目实践仓库 https://github.com/durban89/typescript_demo.gitt ...
- typeScript基础(5)_对象的类型-interfaces接口
接口类型 使用interfaces来给对象定义类型,接口interfaces是对行为的抽象,而具体如何行动需要类来实现implement. TypeScript 中的接口是一个非常灵活的概念,除了可用 ...
最新文章
- java.lang类在电脑哪个位置_Java中的java.lang.Class API 详解
- Java多线程编程笔记之Condition
- 机器人科迪的天空_机器人科迪的天空游戏评测:我要跳的更高
- Sorry, user *** is not allowed to execute ‘xxxx‘ as root on ****.
- JSON.parse和JSON.stringify方法
- phpstudy-5.6.27-nts 安装redis扩展
- Git中的pull request真正比较的是什么?
- EssentialC++
- 赫夫曼树的定义及原理
- Vuforia开发完全指南
- 光学软件市场现状研究分析报告-
- 计算机apk文件无法打开,【电脑怎么打开apk文件】电脑如何打开apk文件_电脑上怎么打开apk-系统城...
- 4D领导力打造卓越团队
- matlab径向基网络,MATLAB——径向基网络拟合曲线和分类
- 用JavaScript制作简单的网页计算器
- 【软考】高级系统架构设计师学习经验分享
- 根据离散点画直线_excel表格怎么画散点图画直线
- android 手机资源获取失败,三、解决android手机IMEI获取失败终极方案,自定义IMIE,主板+系统定制商+cup指令集+设备参数+显示屏参数+修订版列表等参数生成IMIEI...
- PHP实现24节气的计算方法
- 圆瓶、扁瓶、三色瓶砖、数百品牌分选,弓叶科技的分选神技
热门文章
- net start zabbix agent 服务没有相应控制功能_一步到位,服务器监控就是这么简单...
- python文件批量改名_python文件批量重命名
- php 掌握jquery,完全掌握jquery tmpl模板
- 【XSY2472】string KMP 期望DP
- java笔记之连接数据库
- linux如何过滤字符串,在linux系统如何grep过滤中,不包含某些字符串的命令
- 全国计算机等级考试题库二级C操作题100套(第96套)
- 5大过程组与整体管理
- python函数应用实例_【Python 第22课】 函数应用示例
- 网络知识:说说我们常听说的网络攻击是怎么回事?