接口定义

接口和Java语言一样,都是通过关键字interface定义的,如下例子:

interface People {
name: string;
age: number;
hobby?: string; // 可选属性
readonly sex: string; // 只读属性
run: (steps: number) => void; // 箭头函数
play():void; // 普通函数
}

接口使用

function test(people:People) {
// content
people.sex = 'xxx'; // 编译器报错
} let p = {
age: 1, name: 'z', sex: 'x',
run: (s: number) => {
return 1;
},
play:function() { },
height:180 }
demo(p);

如上例子,当前对象p作为参数传入函数test中时,编译器只会检查那些必需的属性(函数也是一种属性)是否存在,类型是否匹配,如果缺少必要的属性,编译器会报错。至于多出的属性height,编译器则不会检查,这点我们可以这样理解:对象pPeople的实现,也就是其子类。height是子类中的属性,这样的话很容易理解。

可选属性

接口里的属性不全都是必需的。属性名后面加上?表示是一个可选属性。

有些是只在某些条件下存在,或者根本不存在.如上述例子中hobby属性,我们在构造p对象时就算没有传入hobby属性,编译器不会报错。

只读属性

只读属性用readonly修饰,一旦该属性赋值后,就不能再修改了,否则编译器报错。

前几章中学习了常量const,它们没有什么差别,最简单判断该用readonly还是const的方法是看要把它做为变量使用还是做为一个属性。 做为变量使用的话用 const,若做为属性则使用readonly。

函数

关于函数的声明有两种,箭头函数和普通方式。在上面的例子中,我们声明了两个函数runplay,虽然生命方法不一样,但是使用方法是一样的,只是作用域不一样,究竟有什么不一样,以后再讲。

接口实现和继承

类可以实现接口,接口也可以继承接口并且只能描述公有属性,这些都是和Java是一样的。

class Player implements People {
name: string;
age: number;
readonly sex: string; // 只读属性 constructor() {
} run= (steps: number) => { } // 箭头函数 play():number { return 100;
}
} interface Player extends People {
item:string;
}

接口继承类,多继承

在Java中接口只能继承接口,而且只能继承一个接口,但是ts中的接口可以继承类,同时支持多继承。接口继承只能继承类中的属性和函数(不继承其实现)。父类中的私有属性和受保护属性也能继承,但是如果这样的继承的话,这个接口类型只能被这个类或其子类所实现。

class Animal {
name: string;
private age: string; run(): void {
console.log('running...');
}
} interface Person extends Animal {} function eat(p: Person) {} let p = { name: '', age: 'x', sayHello: function () { return '' } };
eat(p); // 编译报错

上述代码会报错,因为age是私有属性,而对象p中age是公有的,这样会产生冲突。所以接口Person必须是Animal的子类所实现。

要想编译不报错,有两种方法:第一是将age属性改为公有,第二种是新增一个类,该类是Animal子类, 如下:

class Animal {
name: string;
private age: string; run(): void {
console.log('running...');
}
}
interface Person extends Animal {
say(): void;
}
class Child extends Animal {
say(): void {
}
}
function eat(p: Person) { }
let p = new Child();
eat(p);// 这样不会报错

TypeScript笔记 6--接口的更多相关文章

  1. TypeScript笔记[5]泛型+Dictionary 转

    TypeScript笔记[5]泛型   在C++.C#.Java等主流编程语言中,一般对泛型编程提供了支持.合理利用泛型,可以提高开发效率.提升代码质量. 例如在C++编程语言中,常常利用下面的结构表 ...

  2. typescript中的接口

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

  3. 【TypeScript】TypeScript 学习 2——接口

    在 TypeScript 中,接口是用作约束作用的,在编译成 JavaScript 的时候,所有的接口都会被擦除掉,因为 JavaScript 中并没有接口这一概念. 先看看一个简单的例子: func ...

  4. 笔记-python-redis接口

    笔记-python-redis接口 1.      python 与redis接口 redis是redis数据库的python接口包,为python提供的redis的调用接口. 注:文档内容主要基于h ...

  5. TypeScript完全解读(26课时)_4.TypeScript完全解读-接口

    4.TypeScript完全解读-接口 初始化tslint tslint --init:初始化完成后会生成tslint.json的文件 如果我们涉及到一些规则都会在这个rules里面进行配置 安装ts ...

  6. typescript属性类型接口

    /* typeScript中的接口 - 1.属性类接口 */ /* 接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用.接口定 ...

  7. 探索typescript的必经之路-----接口(interface)

    TypeScript定义接口 熟悉编程语言的同学都知道,接口(interface)的重要性不言而喻. 很多内容都会运用到接口.typescrip中的接口类似于java,同时还增加了更灵活的接口类型,包 ...

  8. TypeScript 高级类型 接口(interface)

    在代码的实现或者调用上能设定一定的限制和规范,就像契约一样.通常,我们把这种契约称为接口. TypeScript的核心原则之一是对值所具有的结构进行类型检查. 有时称为“鸭式辨型法”或“结构性子类型化 ...

  9. TypeScript学习笔记之接口类型

    TypeScript的接口,个人理解就是一种约束,包括各种类型的契约或者代码定义上的契约.当然,和java中的用法基本一致,接口可以被继承也可以被实现. 定义一个简单的interface interf ...

  10. TypeScript Handbook 2——接口1(翻译)

    接口(Interfaces) One of TypeScript's core principles is that type-checking focuses on the 'shape' that ...

随机推荐

  1. laravel框架一种方便的快速填充数据的方法

    首先大家都知道在laravel框架里是采用seeder来填充数据的,具体命令如下,请将如下的类名称替换成你具体的seeder类名. 首先创建seeder类 php artisan make:seede ...

  2. yum 命令详解

    一. yum          作用:                     yum 命令是在Fedora 和RedHat 以及SUSE 中基于rpm 的软件包管理器,它可以使系统管理人员交互和自动 ...

  3. 1.Nginx服务应用

    Nginx服务应用 Nginx的优点和作用 Nginx是一款高性能的HTTP和反向代理的服务器软件,还是一个IMAP/POP3/SMTP(邮件)代理服务器! Nginx在功能实现上都采用模块化结构设计 ...

  4. avro 1.8.2 (js)

    5月15日发布的avro 1.8.2 已经包含了js版代码. 清华大学镜像地址: https://mirrors.tuna.tsinghua.edu.cn/apache/avro/avro-1.8.2 ...

  5. centos7 编译ntopng源码

    先安装编译所需的开发工具 yum groupinstall 'Development Tools' yum install tcl yum install libpcap libpcap-devel ...

  6. 【转】java.lang.NoSuchMethodError: javax.persistence.Table.indexes()[Ljavax/persistence/Index;

    最近在配置最新的ssh(struts2.3.16.3+hibernate4.3.7+spring4.1.2)的时候遇到的这个错误提示,后来在网上找了半天都不能解决,虽然有个说法是model对象用这样@ ...

  7. sql sever分组查询和连接查询

    分组查询select 查询信息 from 表名where 条件group by 按照列分组(可多个 ,隔开)order by 排序方式(查询信息如果列名和聚合函数同时出现,要么在聚合函数中出现,要么就 ...

  8. vue:简单方法替代vuex或者bus

    兄弟组件,隔代组件传值很麻烦,方法虽然多,但都各有缺点. vuex: 适合数据量大,并且函数集中处理. bus:适合数据虽少,却不得不用的时候,维护困难. root:这儿指将值挂在root组件上,需要 ...

  9. Struts2下载

    package com.tcf.action; import java.io.BufferedInputStream; import java.io.FileInputStream; import j ...

  10. angular4.0常用依赖汇总

    Routes 路由配置 Router 路由跳转 ActivatedRoute 路由参数 FormsModule 表单配置(在app.module.ts中注入在imports下) EventEmitte ...