TypeScript 的高级特性

Unsplash

1. 类

在 ES5 中是没有 类(Class) 的概念的，我们通常会通过构造函数定义并生成新对象，而在 ES6 中引入了类（Class）的概念，但 class 的本质是一个语法糖，只是让对象原型的写法更加清晰，而在使用 TypeScript 开发时，大部分代码都是写在类里面的

使用 class 关键字 + 类名即可完成 类的声明，可以在类里面指定属性和方法，声明一个类之后，我们就可以通过 new 关键字进行实例化

类的实例化

在声明一个类的时候，我们可以给类的属性和方法指定一个访问控制符，其作用是控制类的属性和方法能否在类外部被访问到，访问控制符一共有三个，public 为共有的，即在类的内部和外部都能被访问到，不声明访问控制符，默认即为 public；private 为私有的，即在类的外部无法访问；protected 为受保护的，在类的内部和子类当中可以访问到

访问控制符_1

访问控制符_2

访问控制符_3

类的构造函数 其实就是类里的一个方法，该方法只会在类的实例化时被调用，并且只会调用这一次

类的构造函数

运行结果

了解了构造函数之后，我们就可以通过构造函数来建立一个约定，例如，在实例化 Person 类的时候，必须指定 name 属性，而在构造函数当中，必须给属性写上访问控制符，只有写上访问控制符，才是声明了 name 属性

构造函数_1

构造函数_2

类的继承 通过 extends 关键字来声明一种继承的关系，即当一个类继承另一个类时，它就拥有继承类的所有属性和方法，我们还可以在新声明类里指定新的属性及方法

类的继承extend_1

类的继承extend_2

除了 extend 关键字外，类的继承还有一个 super 关键词，这里的 super 有两个用法，一个是调父类的构造函数，这里有个硬性规定是 子类的构造函数必须调用一下父类的构造函数，第二个用法是，用来调父类的其他方法，通过 super. 进行调用

类的继承super_1

类的继承super_2

运行结果

2. 泛型

泛型(generic) 指的是参数化的类型，一般用来限制集合的内容，我们结合上个例子进行说明，我们声明一个 n2 数组，并指定 Array 类型，在类型后加上 <Person> 来限制该数组，它规定了这个数组里只能放 Person 类

泛型

3. 接口

接口(interface) 是用来建立某种代码约定，使得其他开发者在调用某个方法或创建新的类时必须遵循接口所定义的代码约定，JavaScript 里是没有接口这一概念的，而 TypeScript 中提供了两个关键字来支撑接口这个特性

使用 interface 关键字 + 接口名即可声明一个接口，接口有两种使用方式，一种是作为一个方法的参数类型声明，使用这种方式时，JavaScript 会检查传入参数是否满足接口声明的所有属性，第二种用法是，在接口里面声明一个方法，那么所有声明实现这个接口的类必须得实现这个方法

接口_1

接口_2

4. 模块

模块(Module) 可以帮助开发者将代码分割为可重用的单元。开发者可以自己决定将模块中的哪些资源（类、方法、变量）暴露出去供外部使用，哪些资源只在模块内使用

模块

5. 注解

注解(annotion) 为程序的元素（类、方法、变量）加上更直观更明了的说明，这些说明信息与程序的业务逻辑无关，而是供指定的工具或框架使用的，下面的这段代码是 Angular 2 框架中的注解示例

import { Component } from '@angular/core'@Component({    selector: 'app-root',    templateUrl: './app.component.html',    styleUrls: ['./app.component.css']
})export class AppComponent {
    title = 'niangao'}

6. 类型定义文件

类型定义文件(*.d.ts) 用来帮助开发者在 Typescript 中使用已有的 JavaScript 的工具包，例如 jQuery，具体可参考 Github DefinitelyTyped 项目，这里再给大家介绍一个工具 Typings，这是专门用来安装类型定义文件的

参考资料
TypeScript入门——JoJozhai

End of File

作者：Nian糕
链接：https://www.jianshu.com/p/48d8da35317c