ES6中的Class关键字和super()方法，使用详细（class类和super()方法）

向右看齐 2023-10-13 07:21 11阅读 0赞

#### **简介：在ES6中，我们可以使用class关键字来定义类，并通过extends关键字实现类的继承，然后在子类中，我们可以使用super()关键字来调用父类的构造函数；今天来分享下class关键字的使用详细。** ####

**1、****首先，使用class关键字，定义一个父类；**

这里定义一个名为Fatherfn的class类，类名字首字母要大写
    
    class Fatherfn{ 
    
        constructor是默认构造方法，不能修改
        constructor(name) { 
            this.name = name;
                         }
        父类中的eat()方法
        eat() { 
            console.log(`${this.name} is eating.`);
            }
    
       }

**2、****然后再定义一个子类，****通过extends、super()方法，****继承父类名为Fatherfn的class类；**

这里再定义一个名为Son的class类，并通过extends继承上面名为Fatherfn的类
    
    这里继承extends Fatherfn ，继承父类属性
    class Son extends Fatherfn { 
    
            constructor是默认构造方法，不能修改
            constructor(name, hobby) {
                    结合super()方法, 可以继承调用父类的构造函数
                    super(name); 
                    this.hobby= hobby;
                                     } 
            子类中的drink()方法 
            drink() { 
                    console.log(`${this.name} is drinking.`); 
                    } 
    
        }

**3、****最后，创建一个子类的实例对象；**

const demoFn= new Son("Buddy", "study");
    
    // 调用子类的方法 
    demoFn.eat(); 
    // 输出：Buddy is eating. 
    
    demoFn.drink(); 
    // 输出：Buddy is drinking.
    
    可以看到这里既可以使用父类函数中的eat()方法，也可以使用子类函数中的drink()方法。

**注意事项：**

1.  **class关键字，命名的函数，名字首字母要大写（要求，但不强制）；**
2.  **每一个class类里面都有一个constructor构造方法，这个方法名字不能修改；**
3.  **class类中，无法使用es5的function()写法；**

**总结：**

**1、ES6中的class类继承和super()用法可以实现类与类之间的继承关系，然后通过extends关键字，子类可以继承父类的属性和方法。**

**2、在子类的构造函数中，使用super()关键字调用父类的构造函数，并传递相应的参数。这样可以实现代码的复用和扩展，提高代码的可读性和可维护性。**