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. BIOS中断大全

    BIOS中断大全 BIOS中断:1.显示服务(Video Service——INT 10H)  00H —设置显示器模式0CH —写图形象素01H —设置光标形状0DH —读图形象素02H —设置光标 ...

  2. Unity3D动态加载外部资源

    最近一直在和这些内容纠缠,把心得和大家共享一下: Unity里有两种动态加载机制:一是Resources.Load,一是通过AssetBundle,其实两者本质上我理解没有什么区别.Resources ...

  3. 使用php实现爬虫程序 套取网站的图片实例

    <?php //去采集a67 图片 网站链接 http://www.xiamov.com/list/1/p.2 你也可以采集其他网站的图片 //创建链接 dedecms--a67 //设置执行不 ...

  4. wordpress 更改 "Home"为"首页"

    要怎麼更改wordpress的 menu上 那一直顯示著"首頁"的頁籤呢這問題我實在是找好久終於給我找到 在 wp-includes 的 post-template.php 這檔案 ...

  5. php获取https下的内容

    直接用file_get_contents,会报错: $url = ('https://xxx.com"); file_get_contents($url); 错误: Warning: fil ...

  6. BTREE与其它索引的优缺点对比

    数据库BTree索引.Hash索引.Bitmap位图索引的优缺点 (2016-01-05 17:13:40) 转载▼ 标签: 数据库 索引 mysql oracle 分类: IT http://www ...

  7. 转:fork的解释

    原文来自于:http://baike.baidu.com/view/1952900.htm?fr=aladdin fork编辑 叉子\分岔\岔口\复刻,西方人吃饭用的东西,经常用作刀和叉. 计算机程序 ...

  8. Oracle 精简绿色版客户端的配置

    在项目开发中常常用到Oracle.但Oracle 客户端体积很大.安装后,主要用的就1个功能:TNS配置服务名,偶尔用到SqlPlus.在开发过程中,大量使用Navicate和PL/SQL Devel ...

  9. tortoisegit安装使用

    git的使用越来越广泛 使用命令比较麻烦,下面讲解一下tortoisegit的使用 先下载安装git(msysgit)和tortoisegit,安装后提示重启电脑,不解释 1.找一个文件夹做仓库 这里 ...

  10. ASCII是指128个字符(不是256个)和ASCII Extended Characters(就是那些奇怪的外文字符)

    ASCII第一次以规范标准的型态发表是在1967年,最后一次更新则是在1986年,至今为止共定义了128个字元:其中33个字元无法显示(一些终端提供了扩展,使得这些字符可显示为诸如笑脸.扑克牌花式等8 ...