Inheritance is a way to
indicate that a class receives behavior from a parent class. Then we can override, modify or augment
those behaviors on the new class.

  class Report {
data: Array<string>; constructor(data: Array<string>) {
this.data = data;
} run() {
this.data.forEach(function(line) { console.log(line); });
}
}

Call the class:

var r: Report = new Report(['First line', 'Second line']);
r.run();

Result:

 First line
Second line

Now let’s say we want to have a second report that takes some headers and some data but we still
want to reuse how the Report class presents the data to the user.
To reuse that behavior from the Report class we can use inheritance with the extends keyword:

 class TabbedReport extends Report {
headers: Array<string>; constructor(headers: string[], values: string[]) {
this.headers = headers;
super(values) // In Report class : data
} run() {
console.log(headers);
super.run();
}
}

Run:

var headers: string[] = ['Name'];
var data: string[] = ['Alice Green', 'Paul Pfifer', 'Louis Blakenship'];
var r: TabbedReport = new TabbedReport(headers, data)
r.run();

[TypeScript] Inheritance的更多相关文章

  1. [Vue @Component] Extend Vue Components in TypeScript

    This lesson shows how you can extend and reuse logic in Vue components using TypeScript inheritance. ...

  2. [TypeScript] Sharing Class Behavior with Inheritance in TypeScript

    Typescript classes make inheritance much easier to write and understand. In this lesson we look into ...

  3. Typescript 查缺补漏

    Types Casting: let input = xxx as HTMLInputElement; let input = <HTMLElement>xxxx; Object Shap ...

  4. JavaScript是如何工作的:深入类和继承内部原理 + Babel和TypeScript 之间转换

    这是专门探索 JavaScript 及其所构建的组件的系列文章的第 15 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...

  5. Angular基础(三) TypeScript

    一.模仿Reddit a) 运行ng new –ng4angular-reddit创建应用,从随书代码中复制样式文件,新建组件app-root,代码为: 界面可以看到了: b) 对于界面输入的数据,获 ...

  6. typescript枚举,类型推论,类型兼容性,高级类型,Symbols(学习笔记非干货)

    枚举部分 Enumeration part 使用枚举我们可以定义一些有名字的数字常量. 枚举通过 enum关键字来定义. Using enumerations, we can define some ...

  7. typescript类(学习笔记非干货)

    我们声明一个 Greeter类.这个类有3个成员:一个叫做greeting的属性,一个构造函数和一个greet方法. We declare a Greeter class. This class ha ...

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

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

  9. [TypeScript] Create a fluent API using TypeScript classes

    You can create an easy to chain API using TypeScript classes. Learn about the thisreturn type annota ...

随机推荐

  1. php字符串处理函数常见问题

    PHP 的字符串处理功能非常强大,主要包括: 字符串输出 echo():输出一个或多个字符串 print():输出一个字符串 printf():输出格式化字符串 字符串去除 trim():去除字符串 ...

  2. Android中的Selector的用法

    转自: Android中的Selector主要是用来改变ListView和Button控件的默认背景.其使用方法可以按一下步骤来设计: (以在mylist_view.xml为例) 1.创建mylist ...

  3. Ajax 的同步与异步

    1.Ajax的工作原理如图: 2.同步 XMLHttpRequest 对象用于和服务器交换数据. XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参 ...

  4. 转:PHP非阻塞模式

    你可以任意转摘“PHP非阻塞模式”,但请保留本文出处和版权信息.作者:尘缘,QQ:130775,来源:http://www.4wei.cn/archives/1002336 让PHP不再阻塞当PHP作 ...

  5. UNIX Filesystems - Evolution Design and Implementation.pdf

    UNIX Filesystems - Evolution Design and Implementation.pdf

  6. Node.js缓冲器

    纯JavaScript是Unicode友好的,但对二进制数据不是很好.当与TCP流或文件系统打交道时,有必要处理字节流. Node提供缓冲器类,它提供实例来存储原始数据相似的一个整数数组,但对应于在V ...

  7. SharePoint ListTemplateType enumeration

    from microsoft http://msdn.microsoft.com/en-us/library/office/microsoft.sharepoint.client.listtempla ...

  8. unity3d 幻灯片效果实现

    上一篇使用的是静态方式进行的加载,采用的数据结构为 数组 该篇文章则是使用动态加载的方式实现: this.objsOfRouses = Resources.LoadAll("images&q ...

  9. Unity3d场景合并

    Unity3d场景合并 一.Unity3d场景合并,有一次的情况是这样的,就是我们是每个人都在开发,每个人有不同的场景,那么合并的时候,有些会出问题,那么我有一个好的方案,就是首先弄一个公共的资源库, ...

  10. UBUNTU下FPT工具--lftp使用说明

    lftp 是UBUNTU下一个功能强大的下载工具,它支持访问文件的协议: ftp, ftps, http, https, hftp, fish.(其中ftps 和https需要在编译的时候包含open ...