以不同视角看Class：揭秘JavaScript中原型和继承的奥秘

2024-01-10 16:57:31

在学习了C#之后，回头再看JavaScript时，第一时间就想到关于Class和伪类。当初在看《JavaScript高程》和《JavaScript语言精粹》时，关于原型和继承的相关章节不止一次地提到了伪类，并阐述了使用伪类的优点和缺点。“伪类”形式可以给习惯了使用基于类的编程语言的人一些直观的感受，但同时也会带来一些局限性。

JavaScript中的Class：伪类还是真Class？

在JavaScript中，我们经常会看到类似于class的语法，例如：

class Person {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, my name is ${this.name}!`);
  }
}

乍一看，这似乎是JavaScript中真正的Class，但实际上并非如此。JavaScript中的class实际上只是语法糖，它底层仍然是基于原型和继承的机制来实现的。

原型和继承：JavaScript的精髓

在JavaScript中，对象是通过原型（prototype）来实现继承的。每个对象都有一个内部属性[[Prototype]]，指向它的原型对象。当访问一个对象的属性或方法时，如果没有找到，则会沿着[[Prototype]]链向上查找，直到找到为止。

例如，在上面的Person类中，Person.prototype是一个对象，它包含了Person类的共有属性和方法。当我们创建了一个Person类的实例时，这个实例就会继承Person.prototype中的属性和方法。

Class和伪类：异同比较

特性	Class	伪类
语法	`class`	`function`
继承	通过`extends`实现	通过`prototype`链实现
实例化	使用`new`关键字创建实例	使用`function`调用创建实例
属性和方法	定义在`class`主体中	定义在`function`主体中
访问控制	可以使用`public`、`protected`和`private`关键字控制访问权限	只能使用`public`访问权限