JavaScript 类和继承详解:ES6+ OOP

Javascript教程 2025-10-16

介绍

JavaScript 刚开始时,不像 Java 或 Python 等其他语言那样拥有类。开发人员不得不使用函数来模拟面向对象编程。在ES6中,JavaScript    引入了继承,使代码更易于阅读、重用和维护。

简单来说:

  • 就像创建对象的蓝图。

  • 继承允许一个类共享或扩展另一个类的功能。

您将学到什么

  • JavaScript 中有哪些类

  • 如何创建和使用类

  • 继承的含义及其用途

  • 如何使用一个类从另一个类扩展extends

  • 类和继承的真实示例

  • 为什么这些功能使您的代码更易于管理

JavaScript 中的类是什么?

在 ES6 之前,开发者使用构造函数来创建对象。这种方法虽然有效,但对初学者不太友好。类通过提供一种更简洁、更易理解的方式来定义对象及其行为,从而解决了这个问题。

把类想象成汽车的蓝图。蓝图描述了每辆汽车应该具备的功能(车轮、发动机、车门)。然后,你可以使用该蓝图来构建不同的汽车,例如丰田或特斯拉。

例子:

class Car { 
  constructor(brand, model) { 
    this.brand = brand; 
    this.model = model; 
  } 
  drive() { 
    return `${this.brand} ${this.model} is driving.`; 
  }
}
const car1 = new Car("Toyota", "Corolla");
console.log(car1.drive());

这里:

  • Car是类(蓝图)。

  • car1是从 Car 蓝图创建的实例。

继续:什么是继承?

既然你已经了解了什么是类,我们来谈谈继承。继承允许一个类从另一个类获取属性和方法。这样就避免了重写相同的代码。

例如,让我们将汽车蓝图扩展为电动汽车蓝图:

class ElectricCar extends Car { 
  charge() { 
    return `${this.brand} ${this.model} is charging.`; 
  }
}
const tesla = new ElectricCar("Tesla", "Model 3");
// Inherited from Car
console.log(tesla.drive()); 

// Unique to ElectricCar
console.log(tesla.charge());

这里:

  • ElectricCar继承自Carusing extends

  • 它仍然可以添加自己的方法(charge)。

这就像在现实生活中一样:

  • 汽车具有共同的特征(车轮、车门、发动机)

  • 电动汽车仍然是汽车,但它还具有充电等特殊功能。

为什么类和继承很重要

类和继承不仅仅是为了减少打字;它们可以帮助您组织项目并避免混淆。

例如:

  • 网上购物应用程序中,您可以开设一User门课程。

  • 然后,您可以创建CustomerAdmin扩展的类User

  • 两者具有共同的特征,如nameemail

  • Customer可以添加购物车,同时Admin可以管理商品。

  • 两者具有共同的特征,如nameemail

  • Customer可以添加购物车,同时Admin可以管理商品。

  • 两者具有共同的特征,如nameemail

  • Customer可以添加购物车,同时Admin可以管理商品。

这样,您的代码就更接近现实世界的逻辑,从而更易于维护和扩展。

结论

ES6 中引入的 JavaScript 类和继承,为开发者提供了一种现代化的面向对象编程方式。类可以理解为构建对象的蓝图,而继承则可以理解为一种传承或添加额外功能的方式。

就像现实生活中一样,电动汽车仍然是汽车,但拥有额外的功能。您的代码可以构建为共享共同特征,同时又保留独特性。从车辆、用户或产品等小示例开始尝试,您将看到类和继承如何让您的 JavaScript    项目更简洁、更智能、更强大。