总目录

从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. MAP--复杂map结构的构造

    我的关键结构比如 struct{     int a;     int b;     int c; }s: 因为这三个数据是基本信息,可以唯一区别一个设备.拿这样一个数据结构作为索引就能找到每个设备. ...

  2. FZU 1062 洗牌问题

    首先有一个规律:当一个数字归位的时候,所有数字都会归位. 因此只需要模拟一个数字就可以了. #include<cstdio> #include<cstring> #includ ...

  3. 解决KVM中鼠标不同步问题

    VNCViewer中的鼠标走得总是比本地系统中的鼠标要慢,不同步,往往实体机中的鼠标都移出vnc窗口外边了,虚拟机中的鼠标指针还没移到需要点击的位置,操作起来很不方便. 起初的想法也是配置的问题,就按 ...

  4. TCP/IP 标志位 SYN ACK RST UTG PSH FIN

    三次握手:发送端发送一个SYN=1,ACK=0标志的数据包给接收端,请求进行连接,这是第一次握手:接收端收到请求并且允许连接的话,就会发送一个 SYN=1,ACK=1标志的数据包给发送端,告诉它,可以 ...

  5. Hibernate 继承表结构

    有Product , Book ,Clothes三张表 Product:id,name Book: id ,name,pageCount Clothes: id ,name ,size 创建三张表 产 ...

  6. iOS开发~CocoaPods使用详细说明 分类: ios相关 2015-04-01 16:45 68人阅读 评论(0) 收藏

    iOS开发-CocoaPods使用详细说明 一.概要 iOS开发时,项目中会引用许多第三方库,CocoaPods(https://github.com/CocoaPods/CocoaPods)可以用来 ...

  7. ModelDriven动作(转)

    所谓ModelDriven ,意思是直接把实体类当成页面数据的收集对象.比如,有实体类User 如下: package cn.com.leadfar.struts2.actions; public c ...

  8. ECSHOP中ajax的调用原理

    ECSHOP中ajax的调用原理 ecshop中ajax的调用原理. 1.首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是 ...

  9. 二级横向菜单实现——ListView

    实现类似于大众点评客户端的横向listview二级列表 这种横向的listview二级列表在手机软件上还不太常见,但是使用过平板的都应该知道,在平板上市比较常见的.可能是因为平板屏幕比较大,而且也能展 ...

  10. 中英文混合字符串截取java

    //截取字符串长度(中文2个字节,半个中文显示一个) public String subTextString(String str,int len){ if(str.length()<len/2 ...