JavaScript 中的类和对象（上）

2024-01-27 13:07:57

前言

在《你所不知道的JavaScript》一书中，作者Kyle Simpson通过深入剖析JavaScript的底层原理，为读者揭示了这门语言的奥秘。在书中，他将JavaScript类和对象视为两个密切相关的概念，并从构造函数、原型、继承和封装等角度对它们进行了详细的讲解。在本文中，我们将重点关注JavaScript中的类和对象，并尝试用更加通俗易懂的语言来解释这些概念。

类和对象

在JavaScript中，类是一种用来创建对象的蓝图，它定义了对象的数据结构和行为。对象则是类的实例，它具有类所定义的数据结构和行为。类和对象的关系就像是一个模板和它的副本。

构造函数

构造函数是一种特殊的函数，它用于创建对象的实例。构造函数的名称与类名相同，它通常以大写字母开头。在构造函数中，我们可以定义对象的属性和方法。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

在这个示例中，Person是一个类，它有一个名为name的属性和一个名为age的属性。Person类还有一个名为Person的构造函数，它接收两个参数：name和age。在构造函数中，我们使用this来给对象设置属性。

原型

原型是一个特殊的对象，它存储着类的属性和方法。每个类都有一个原型，并且每个对象的原型都是该类的原型。我们可以通过Object.getPrototypeOf()方法来获取对象的原型。

const person = new Person('John', 30);
console.log(Object.getPrototypeOf(person)); // Person {}

在这个示例中，person是一个Person类的实例。我们使用Object.getPrototypeOf()方法获取person的原型，并将其输出到控制台。我们可以看到，person的原型是一个Person对象。

继承

继承是指一个类可以继承另一个类的属性和方法。在JavaScript中，我们可以使用extends关键字来实现继承。

class Student extends Person {
  constructor(name, age, grade) {
    super(name, age);
    this.grade = grade;
  }
}

在这个示例中，Student类继承了Person类。Student类有一个名为grade的属性，它存储着学生的成绩。Student类还重写了Person类的构造函数，并在构造函数中初始化了grade属性。

封装

封装是指将对象的属性和方法隐藏起来，只允许通过特定的方法来访问它们。在JavaScript中，我们可以使用private关键字来实现封装。

class Person {
  #name;
  #age;

  constructor(name, age) {
    this.#name = name;
    this.#age = age;
  }

  getName() {
    return this.#name;
  }

  getAge() {
    return this.#age;
  }
}