TypeScript实例讲解（二十八）

这是我参与11月更文挑战的第28天，活动详情查看：2021最后一次更文挑战

接上一篇：TypeScript实例讲解（二十七）

本篇内容：TypeScript 静态成员。

静态成员

我们可以把类中的成员分为：实例成员和静态成员两个大类。大家可能了解过 ES6 中的静态成员，在 TypeScript 中类也存在静态成员。

在类中通过 static 关键字修饰的属性和方法分别称为静态属性和静态方法，统称为静态成员。类的静态成员可以使用 类名.变量名 的形式访问，不需要创建类的实例。

静态属性

// 例 1
class Person {
    static age = 20;
}
console.log(Person.age);   // 20

例1的属性 age 被 static 修饰，成为了静态属性。静态属性有以下特点：
1、属性前面有 static 关键字修饰。
2、通过类名来访问属性。
3、静态属性不能被实例继承，只能通过类名来调用。

静态方法

// 例 2
class Person {
    static sayHi() {
        return 'hello'
    }
}
console.log(Person.sayHi());   // hello

静态方法的特点与静态属性一致。

注意：有一些特殊的属性名，不能用于 TypeScript 类的静态成员变量名。如：name 等，如果使用了这些特殊的属性名，则会语法错误提示如下：
Static property 'name' conflicts with built-in property 'Function.name' of constructor function 'Person'。

// 例 3
class Person {
    static readonly age = 20;
}
console.log(Person.age);   // 20

当静态成员有其他修饰符修饰时，static 关键字必须写在其他修饰符（如例3的 readonly）的前面。

应用：单例模式

了解过设计模式的同学都知道有一个非常著名的模式就是单例模式。单例模式就是一个类只允许通过这个类获取一个实例。

// 例 4
class Single {
    private static instance: Single;
    private constructor(public name: string) {}

    static getInstance() {
        if (!this.instance) {
            this.instance = new Single('bear');
        }
        return this.instance;
    }
}

const single1 = Single.getInstance();
const single2 = Single.getInstance();

constructor 被关键字 private 修饰，变成了私有的，所以无法通过 new 语法创建实例。
static 表示把方法直接挂载到类上，而不是挂载到类的实例上。所以才能通过 Single.getInstance() 调用。

例4中变量 single1 和变量 single2 是完全相同的，这样就构成了一个单例。

本篇完！如果文章对你有一点点帮助，请记得点个赞哦。