如何有效掌握并运用JavaScript中的class和js关键字？

JavaScript 关键词

1.class 关键字

简介

class 是 ES6 (ECMAScript 2015) 引入的用于定义类的关键字，它提供了一种更清晰和面向对象的方式来创建对象。

语法

class ClassName {
    constructor(...args) {
        // 构造函数代码
    }
    
    method() {
        // 方法代码
    }
}

示例

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.);
    }
}
const person = new Person("John", 30);
person.greet(); // 输出: Hello, my name is John and I am 30 years old.

特点

构造函数：constructor 方法在实例化类时自动调用，用于初始化对象属性。

方法：类中可以包含多个方法，这些方法可以在类的实例上调用。

继承：可以使用extends 关键字实现类的继承。

2.extends 关键字

简介

extends 是 ES6 引入的用于实现类继承的关键字，它允许一个类继承另一个类的属性和方法。

语法

class SubClass extends SuperClass {
    // 子类代码
}

示例

class Animal {
    constructor(name) {
        this.name = name;
    }
    
    speak() {
        console.log(${this.name} makes a sound.);
    }
}
class Dog extends Animal {
    constructor(name, breed) {
        super(name); // 调用父类的构造函数
        this.breed = breed;
    }
    
    speak() {
        console.log(${this.name} barks.);
    }
}
const dog = new Dog("Buddy", "Golden Retriever");
dog.speak(); // 输出: Buddy barks.

特点

调用父类构造函数：使用super() 调用父类的构造函数。

覆盖方法：子类可以覆盖父类的方法。

访问父类方法：子类实例可以访问父类的方法。

相关问题与解答

问题 1：如何在 JavaScript 中使用class 关键字创建一个类？

解答：使用class 关键字创建一个类的基本语法如下：

class ClassName {
    constructor(...args) {
        // 构造函数代码
    }
    
    method() {
        // 方法代码
    }
}

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 的类，并定义了一个构造函数和一个greet 方法。

问题 2：如何使用extends 关键字实现类的继承？

解答：使用extends 关键字实现类的继承的基本语法如下：

class SubClass extends SuperClass {
    // 子类代码
}

class Animal {
    constructor(name) {
        this.name = name;
    }
    
    speak() {
        console.log(${this.name} makes a sound.);
    }
}
class Dog extends Animal {
    constructor(name, breed) {
        super(name); // 调用父类的构造函数
        this.breed = breed;
    }
    
    speak() {
        console.log(${this.name} barks.);
    }
}

在这个例子中，我们创建了一个Dog 类，它继承了Animal 类，并覆盖了speak 方法。

各位小伙伴们，我刚刚为大家分享了有关“class js 关键词”的知识，希望对你们有所帮助。如果您还有其他相关问题需要解决，欢迎随时提出哦！