接口

TypeScript的核心原则之一是对值所具有的结构进行类型检查。它有时被称做“鸭式辨型法”或“结构性子类型化”。在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。

// 接口
// TypeScript的核心原则之一是对值所具有的结构进行类型检查。
// 在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。
interface LabelValue {
label: string;
} function prientLabel(labelObj: LabelValue) {
console.log(labelObj.label);
}
let myObj = {
'label': 'hello Interface'
};
prientLabel(myObj); // LabelledValue 接口就好比一个名字,它代表了有一个 label 属性且类型为 string 的对象。
// 只要传入的对象满足上述必要条件,那么它就是被允许的。 // 可选属性
// 带有可选属性的接口与普通的接口定义差不多,只是在可选属性名字定义的后面加一个 ? 符号。
// 可选属性的好处之一是可以对可能存在的属性进行预定义,好处之二是可以捕获引用了不存在的属性时的错误。
interface Person {
name?: string;
age?: number;
} function printInfo(info: Person) {
console.log(info);
} let info = {
'name': 'cd',
'age':
};
printInfo(info); // {name: "cd", age: 23}
let info2 = {
'name': 'cd'
};
printInfo(info2); // {name: "cd"} // 函数类型
// 接口能够描述 JavaScript 中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外,接口也可以描述函数类型。
// 定义的函数类型接口就像是一个只有参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型。
// 定义后完成后,我们可以像使用其它接口一样使用这个函数类型的接口。
interface SearchFunc {
(source: string, subString: string): boolean;
} let mySearch: SearchFunc;
mySearch = function(source: string,subString: string) {
return source.search(subString) !== -;
}; console.log(mySearch('路飞', '路')); // true
console.log(mySearch('路飞', '龙')); // false // 可索引类型
// 与使用接口描述函数类型差不多,我们也可以描述那些能够“通过索引得到”的类型,比如 a[10] 或 ageMap['daniel']。
// 可索引类型具有一个索引签名,它描述了对象索引的类型,还有相应的索引返回值类型。
interface StringArray{
[index: number]: string;
} let MyArray: StringArray;
MyArray = ['是', '云' , '随' , '风'];
console.log(MyArray[]); // 随 // 类类型
// 与 C# 或 Java 里接口的基本作用一样,TypeScript 也能够用它来明确的强制一个类去符合某种契约。
// 我们可以在接口中描述一个方法,在类里实现它,如同下面的 setTime 方法一样:
interface ClockInterface {
currentTime: Date;
setTime(d: Date);
} class Clock implements ClockInterface {
currentTime: Date;
setTime(d: Date){
this.currentTime = d;
}
constructor(h: number, m: number) {}
} // 继承接口
// 和类一样,接口也可以相互继承。
// 这让我们能够从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。
// 一个接口可以继承多个接口,创建出多个接口的合成接口。
interface Shape {
color: string;
} interface PenStroke {
penWidth: number;
} interface Square extends Shape, PenStroke {
sideLength: number;
} let s = <Square>{};
s.color = 'blue';
s.penWidth = ;
s.sideLength = ;
console.log(s); // {color: "blue", penWidth: 100, sideLength: 10}

泛型

软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵活的功能。

在像C#和Java这样的语言中,可以使用泛型来创建可重用的组件,一个组件可以支持多种类型的数据。这样用户就可以以自己的数据类型来使用组件。

// 泛型
// 如下代码,我们给 Hello 函数添加了类型变量 T ,T 帮助我们捕获用户传入的类型(比如:string)。
// 我们把这个版本的 Hello 函数叫做泛型,因为它可以适用于多个类型。
// 代码中 output 和 output2 是效果是相同的,
// 第二种方法更加普遍,利用了类型推论 —— 即编译器会根据传入的参数自动地帮助我们确定T的类型。
function Hello<T>(arg: T): T {
return arg;
} let outPut = Hello<string>('Hello Generic');
let output2 = Hello('Hello Generic') console.log(outPut);
console.log(output2);

作者:longWinter666

TypeScript----接口和泛型的更多相关文章

  1. 从C#到TypeScript - 接口

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  2. TypeScript完全解读(26课时)_6.TypeScript完全解读-泛型

    6.TypeScript完全解读-泛型 创建实例ts文件generics.ts 在index.ts内引入 fill是填充数组,创建的数组的元素数是times,填充的值就是接收的value的值 这里传入 ...

  3. 十分钟教你理解TypeScript中的泛型

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者.原文出处:https://blog.bitsrc.io/understanding-generics-in-t ...

  4. 《三》大话 Typescript 接口

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

  5. TypeScript接口与类的使用

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

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

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

  7. TypeScript 接口继承

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

  8. Web Service接口返回泛型的问题(System.InvalidCastException: 无法将类型为“System.Collections.Generic.List`1[System.String]”的对象强制转换为类型“System.String[]”)

    在使用C#写Web Service时遇到了个很奇怪的问题.返回值的类型是泛型(我用的是类似List<string>)的接口,测试时发现总是报什么无法转换为对象的错误,百思不得其解. 后来在 ...

  9. typescript中的泛型

    泛型:软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性. 组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵活的功能. 在像C#和Ja ...

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

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

随机推荐

  1. c# TCP/IP协议利用Socket Client通信(只含客户端Demo)

    完全是基础,新手可以随意看看,大牛可以关闭浏览页了,哈哈. TCP/IP协议 TCP/IP是一系列网络通信协议的统称,其中最核心的两个协议是TCP和IP.TCP称为传输控制协议,IP称为互联网络协议. ...

  2. css 字体库和动画

    @font-face { font-family:'WebSymbols'; src: url('../font/WebSymbols-Regular.otf'); } .icon{ font-fam ...

  3. 题解 P2859 【[USACO06FEB]摊位预订Stall Reservations】

    题目链接: https://www.luogu.org/problemnew/show/P2859 思路: 首先大家会想到这是典型的贪心,类似区间覆盖问题的思路,我们要将每段时间的左端点从小到大排序, ...

  4. python之输入一系列整数输出最大值

    在python学习中,我们经常会遇到:编写一个程序,输入若干整数或者是在一串字符中,输出最大值(数)的问题.那么在这里,我给出了几种常见的,也是几种比较常用的方法,希望能给大家的学习带来一定的帮助. ...

  5. CSS3总结二:(background)背景/渐变色函数

    background-color(CSS2) background-image background-position background-size background-repeat backgr ...

  6. day12 css样式

    目录 1.标签分类   2.浮动布局   3.margin塌陷   4.定位postion   5.背景图 一. 标签分类 默认在标准文档流 行内标签 span,a,em,i,strong,b,inp ...

  7. 移动端iOS点击闪烁

    移动端iOS点击闪烁 1. $("#id").bind("touchstart click",function(e){ 2. e.stopPropagation ...

  8. OGG学习笔记01

    OGG学习笔记01-基础概述OGG(Oracle Golden Gate),最近几年在数据同步.容灾领域特别火,甚至比Oracle自己的原生产品DataGuard还要风光,主要是因为其跨平台.跨数据库 ...

  9. SokcetClient VC++6.0

    // SokcetClient.cpp: implementation of the SokcetClient class. // ////////////////////////////////// ...

  10. ueditor 去掉自动跟随内容的<p><br /></p>

    //编辑器不能为空内容 if (domUtils.isEmptyNode(me.body)) { me.body.innerHTML = ''; ueditor.all.js  删除BR 如果还不行, ...