# 类(Class)

传统的面向对象语言基本都是基于类的，JavaScript 基于原型的方式让开发者多了很多理解成本，在 ES6 之后，JavaScript 拥有了 class 关键字，虽然本质依然是构造函数，但是开发者已经可以比较舒服地使用 class了。

但是 JavaScript 的 class 依然有一些特性还没有加入，比如修饰符和抽象类等。

之于一些继承、静态属性这些在 JavaScript 本来就存在的特性，我们就不过多讨论了。

# 抽象类

抽象类做为其它派生类的基类使用,它们一般不会直接被实例化,不同于接口,抽象类可以包含成员的实现细节。

abstract 关键字是用于定义抽象类和在抽象类内部定义抽象方法。

比如我们创建一个 Animal 抽象类:

abstract class Animal {
    abstract makeSound(): void;
    move(): void {
        console.log('roaming the earch...');
    }
}

我在实例化此抽象类会报错：

我们不能直接实例化抽象类，通常需要我们创建子类继承基类,然后可以实例化子类。

class Cat extends Animal {

    makeSound() {
        console.log('miao miao')
    }
}

const cat = new Cat()

cat.makeSound() // miao miao
cat.move() // roaming the earch...

# 访问限定符

传统面向对象语言通常都有访问限定符，TypeScript 中有三类访问限定符，分别是: public、private、protected。

# public

在 TypeScript 的类中，成员都默认为 public, 被此限定符修饰的成员是可以被外部访问。

class Car {
    public run() {
        console.log('启动...')
    }
}

const car = new Car()

car.run() // 启动...

# private

当成员被设置为 private 之后, 被此限定符修饰的成员是只可以被类的内部访问。

# protected

当成员被设置为 protected 之后, 被此限定符修饰的成员是只可以被类的内部以及类的子类访问。

class Car {
    protected run() {
        console.log('启动...')
    }
}

class GTR extends Car {
    init() {
        this.run()
    }
}

const car = new Car()
const gtr = new GTR()

car.run() // [ts] 属性“run”受保护，只能在类“Car”及其子类中访问。
gtr.init() // 启动...
gtr.run() // [ts] 属性“run”受保护，只能在类“Car”及其子类中访问。

# class 可以作为接口

上一节我们讲到接口（interface），实际上类（class）也可以作为接口。

而把 class 作为 interface 使用，在 React 工程中是很常用的。

比如我之前写过一个轮播组件