揭秘JS中的“类”创建与继承过程

尽管在实际业务开发中，初中级前端程序员接触类(class)的概念比较少，但在面试中经常涉及到相关的概念。一些代码仓库中，类(class)的使用也很频繁。一说起类(class)，就绕不开constructor、super这些概念。从这些概念入手，解析类(class)创建与继承的过程，就可以较为清晰明了了。

1. 类的定义和创建

   从语法的角度看，类的定义和创建使用 class 。例如：

   class Person {
     constructor(name, age) {
       this.name = name;
       this.age = age;
     }
   
     // 方法
     greet() {
       console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
     }
   }
   

   这个代码定义了一个名为 Person 的类，具有 name 和 age 两个属性，以及一个 greet() 方法。然后，我们创建一个新的 Person 对象：

   const person1 = new Person('John', 30);
   

   这样，就创建了一个名为 person1 的 Person 对象，具有 John 的姓名和 30 的年龄。

2. 继承：子类和超类

   子类是继承了超类(又称基类)的所有属性和方法的新类。超类中的属性和方法可以被子类继承和使用，子类还可以在超类的基础上定义自己的属性和方法。例如：

   class Employee extends Person {
     constructor(name, age, salary) {
       super(name, age); // 调用父类的构造函数
       this.salary = salary;
     }
   
     // 方法
     work() {
       console.log(`I'm ${this.name} and I'm working.`);
     }
   }
   

   这个代码定义了一个名为 Employee 的类，它继承了 Person 类。Employee 类具有 name、age 和 salary 三个属性，以及 greet() 和 work() 两个方法。Employee 类通过 extends 关键字继承了 Person 类的属性和方法，并添加了自己的 salary 属性和 work() 方法。

   然后，我们创建一个新的 Employee 对象：

   const employee1 = new Employee('Mary', 25, 50000);
   

   这样，就创建了一个名为 employee1 的 Employee 对象，具有 Mary 的姓名、25 的年龄和 50000 的工资。

结语

希望这篇文章能帮助你理解JS中的类创建与继承过程。如果你有任何其他问题，欢迎留言。