总目录

从C#到TypeScript - 接口

为了更好的抽象出行为和属性,TypeScript在ES6的基础上增加了接口interface

C#也有interface,不过TypeScript的接口还不大一样,C#里的接口一般是为类服务,让类实现接口中定义的方法或属性。

TypeScript在C#基础上更进一步,由于JavaScript是门非常灵活的语言,TypeScript作为JavaScript的超集需要保持灵活性,所以接口在TypeScript里可以脱离具体的类,单独作为类似契约的存在,接口里的属性也并非一定需要实现。

类的接口

这和C#的差不多,描述了公共的成员;不过实现接口语法有点类似于Java,用的是implements。

interface Selectable {
isSelected: boolean;
} class Control implements Selectable {
isSelected : boolean;
}

同C#一样,接口可以多重继承其他接口,用的是extends。

interface Editable {}
interface Deleteable {} interface Changeable extends Editable, Deleteable {}

接口的属性

接口的属性可以定义为readonly,这个和C#里只有get没有set的属性有点像,同样,实现接口的类也不一定需要readonly

interface Selectable{
readonly isSelected: boolean;
} class Control implements Selectable{
isSelected: boolean;
} let s: Selectable = { isSelected : true };
s.isSelected = false; // 编译出错, readonly let c: Control = { isSelected : true };
c.isSelected= false; // 没问题

另外,接口还支持可选属性,同C#的可空属性一样,用?表示,实现接口的类可以不用实现可选属性。

interface RequestConfig {
url: string;
body?: any;
} class Request implements RequestConfig {
url: string;
}

接口不需要类的支持

在C#里面,接口如果没有类来实现的话是没有什么意义的,但在TypeScript里不一样,接口可以单独使用。

interface RequestConfig {
url: string;
body?: any;
} let config: RequestConfig = {url: 'www.google.com'};

这种经常用在函数的参数上面,用来描述具体的参数,把具体的参数放到接口里,方便操作,也方便重构。

function Request(config: RequestConfig){

}

接口除了描述属性外,还可以用来描述函数,不过一个接口只能描述一个函数,描述时定义好参数和返回值即可。

从实现上看有点类似于C#的delegate

interface CheckLogin {
(name: string, pwd: string): boolean;
} let check: CheckLogin = function(name: string, pwd: string): boolean {
return false;
}

另外,接口还可以用来描述可索引类型,就有点类似C#的Dictionary

索引支持两种:numberstring

//定义一个Dict,key是string,value也是string
interface Dict {
[key: string] : string;
} let dict: Dict = { 'key1': 'value1', 'key2': 'value2'};
console.info(dict['key1']); // value1
console.info(dict['key']); // undefined

接口继承类

这在C#中很不可思议,接口居然还可以反过来继承类,不过对于JavaScript里来说,灵活方便很重要,所以TypeScript实现了这个功能来快速生成一个接口。

虽说在比较复杂的继承关系时可能会有用,不过个人认为这个功能还是有点鸡肋,因为复杂的继承通常会引入一些问题如紧耦合,牵一发而动全身,再加上这个,可能更让人摸不着头脑,不如用组合来得好。

接口继承类时会继承类中所有的成员,不管是private,protected还是public,只是不包括其实现。

不过继承了一个类不公开成员的接口只能被该类或该类的子类实现。

class User{
name: string;
protected pwd: string = "123";
} class Admin extends User{
constructor(n: string, p: string){
super();
this.name = n;
this.pwd = p;
}
} interface UserConfig extends User{ //这里包含了name和private的pwd
} let config: UserConfig = new Admin('brook', '123');

泛型

TypeScript是同C#一样支持泛型的,而且在使用方面也差不多,在接口名后面加上<T>即可。

interface Testable<T> {
field: T;
(arg: T): T;
}

也支持泛型约束,关键字是extends

interface Testable<T extends Object> {
field: T;
(arg: T): T;
}

TypeScript的接口对于C#程序员来说是有点奇怪了,不过用过之后还是发现非常符合JavaScript语言灵活的特性。

从C#到TypeScript - 接口的更多相关文章

  1. 《三》大话 Typescript 接口

    > 前言: 本文章为 TypeScript 系列文章. 旨在利用碎片时间快速入门 Typescript. 或重新温故 Typescript 查漏补缺.在官方 api 的基础上, 加上一些日常使用 ...

  2. TypeScript接口与类的使用

    一.TypeScript接口 Interfaces 可以约定一个对象的结构 一个对象去实现一个接口 就必须拥有这个接口中所有的成员用interface定义接口, 并且定义接口中成员的类型 编译之后会发 ...

  3. TypeScript 接口继承

    1.TypeScript 接口继承 和类一样,接口也可以通过关键字 extents 相互继承.接口继承,分为:单继承和多继承,即继承多个接口.另外,接口也可以继承类,它会继承类的成员,但不包括具体的实 ...

  4. typescript接口(学习笔记非干货)

    typescript的核心原则之一就是对所具有的shape类型检查结构性子类型化 One of the core principles of typescript is to check struct ...

  5. typescript接口的概念 以及属性类型接口

    /* 1.vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": "./js", 2.第二步 任务 ...

  6. Typescript 接口(interface)

    概述 typescript 的接口只会关注值的外形,实际就是类型(条件)的检查,只要满足就是被允许的. 接口描述了类的公共部分. 接口 interface Person { firstName: st ...

  7. TypeScript 接口(三)

    TypeScript的核心原则之一是对值所具有的结构进行类型检查. 接口初始: interface objProperty { name: string } function printName(na ...

  8. typescript接口扩展

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

  9. TYpeScript接口的使用

    1.接口中的属性值的使用: // 作用是强制类型检查 interface Iperson { name: string; age: string; } class Person { construct ...

随机推荐

  1. Android面试题随笔1

    1.如何让一个应用在手机上产生两个或多个图标? 在清单文件中的activity节点下配置如下:[5,7行代码] <activity android:name=".MainActivit ...

  2. Salesforce开发者学习笔记之二:Salesforce开发平台应用场景

    Salesforce作为一个全方位的CRM系统可以应用于企业中的各个不同部门以取代手工的,耗时的以及低效的业务流程,例如 基于报表的数据管理和分析 基于电子邮件的协同合作 本地的文件共享 各种手工操作 ...

  3. Online Schema Change for MySQL

    It is great to be able to build small utilities on top of an excellent RDBMS. Thank you MySQL. This ...

  4. HMC5883L地磁传感器驱动

    霍尼韦尔 HMC5883L 是一种表面贴装的高集成模块,并带有数字接口的弱磁传感器芯片,应用于低成本罗盘和磁场检测领域.HMC5883L 包括最先进的高分辨率 HMC118X 系列磁阻传感器,并附带霍 ...

  5. 深入了解Bundle和Map

    [转]http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0402/2684.html 前言 因为往Bundle对象中放入Map实际上 ...

  6. lower_bound和upper_bound算法实现

    lower_bound算法要求在已经按照非递减顺序排序的数组中找到第一个大于等于给定值key的那个数,其基本实现原理是二分查找,如下所示: int lower_bound(vector<int& ...

  7. iOS MVVM 前世今生

    MVVM,Model-View-ViewModel,一个从 MVC 模式中进化而来的设计模式,最早于2005年被微软的 WPF 和 Silverlight 的架构师 John Gossman 提出.

  8. Python - Headless Selenium WebDriver Tests using PyVirtualDisplay

    Here is some Python code showing WebDriver with a virtual display provided by Xvfb: #!/usr/bin/env p ...

  9. 11.TCP的交互数据流

          TCP报文段一般有两类,分别是成块数据和交互数据. 1.交互式输入     Rlogin连接上键入一个交互命令的数据流如下图所示.     每一个交互按键都会产生一个数据分组,每次从客户传 ...

  10. CentOS Linux解决 Device eth0 does not seem to be present

    通过OVF部署Linux主机后提示 ringing up interface eth0:  Device eth0 does not seem to be present,delaying initi ...