TypeScript中的class声明了什么

在初看TypeScript的时候在这里卡住的时间难以估计,并不能很好的理解”换个角度说,我们可以认为类具有 实例部分与 静态部分这两个部分。“这句话。今天再回头看这部分文档,在同事的帮助下突然有了比较通透的理解。

class Greeter {
    
    
    static standardGreeting = "Hello, there";
    greeting: string;
    greet() {
    
    
        if (this.greeting) {
    
    
            return "Hello, " + this.greeting;
        } else {
    
    
            return Greeter.standardGreeting;
        }
    }
}

想要描述上面类声明所表达的信息,需要从两方面去描述:

这个类本身是什么类型?(JavaScript中类作为函数/对象所需要的描述)

这个类被实例化之后的结果是什么类型?(Java中的类所表达的类型信息)

类类型interface描述

类在JS中是函数的语法糖,那么描述类类型和描述函数类型应该没啥区别,上面Greeter 类的类型可以描述如下:

interface GreeterInstanceType {
    
    
  greeting: string;
  greet(): string
}

interface GreeterType {
    
    
  standardGreeting: string;
  new (): GreeterInstanceType
}

使用上面的类型来声明变量,确实没有报错,所以说明上面的类型可以描述class Greeter:

let test1: GreeterType = Greeter
let intance1: GreeterInstanceType = new Greeter()

上面的类型可以看出来有两个interface配合起来才能描述类,而这两部分分别对应的就是:

GreeterInstanceType描述的是类的实例部分

GreeterType描述的是类的自身

这两部分就是TypeScript文档中描述的实例部分静态部分

类类型默认描述

上面是通过interface来描述class是可以做到的,对于描述类,TypeScript还提供了更友好的方法。

let test2: Greeter

test2 = new Greeter()

上面代码中将类Greeter作为类型使用,这里表示的是test2是Greeter类型,这毋庸置疑。
但是Greeter本身表示的是什么呢? 这里表示的是Greeter这个类实例化的对象的类型。

可以换个角度来考虑,相同的代码带入到Java中,如下:

Greeter test2 = new Greeter();

但是如果是这样的一定是有问题的:

Greeter test2 = Greeter;

这是说不通的,因为这里的意思是Greeter这个类型是Greeter这个类的类型。

所以Greeter类作为类型表示的是Greeter类实例对象的类型。

那么怎么通过Greeter类来表示这个类自身(也就是类作为JS函数的描述),而不是这个类的实例呢?

let intance1: typeof Greeter = Gretter

上面的代码可以理解为设置变量instance1的类型为Greeter类型的类型。

Greeter表示的是Greeter实例的类型,那么Greeter实例的类型自然就是Greeter这个类本身的类型。

继续理解typeof:

typeof可以简单理解为提取变量的类型,所以还可以如下使用:

let a: number = 1

let b: typeof a = 2

因为a的类型是number所以typeof a的值是number,所以b的类型就是number。

以上就是我理解的类声明所表达的全部内容。

参考

typescript文档 - 类

猜你喜欢

转载自blog.csdn.net/letterTiger/article/details/109341976