ES6 class介绍

2023-05-23 09:32:18 浏览数 (1)

工作原理

ES6的class是基于原型继承的一种封装方式。它使用了构造函数和原型链的概念来创建和继承对象。通过class,我们可以定义一个类,然后使用该类来创建具有相同属性和方法的对象实例。

class的工作原理如下:

  1. 使用class关键字定义一个类,后面跟着类的名称。
  2. 在类的内部,使用constructor方法定义类的构造函数。构造函数用于初始化对象的属性。
  3. 在类的内部,定义其他的方法。这些方法将成为类的实例的共享方法。
  4. 使用new关键字和类名称来创建对象实例。
  5. 可以通过类的实例访问和调用类的属性和方法。

语法

以下是ES6 class的基本语法:

代码语言:javascript复制
class ClassName {
  constructor(/* 构造函数参数 */) {
    // 构造函数代码
  }

  /* 方法定义 */
}

在类的内部,我们可以定义构造函数和其他的方法。构造函数使用constructor关键字定义,其他方法则直接在类的内部定义。

示例

让我们通过一些示例来理解ES6 class的使用。

示例1:定义和使用类

代码语言:javascript复制
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name}. I'm ${this.age} years old.`);
  }
}

const john = new Person('John', 30);
john.sayHello(); // 输出:Hello, my name is John. I'm 30 years old.

在上面的示例中,我们定义了一个Person类,它有两个属性nameage,以及一个方法sayHello()。在构造函数中,我们使用传入的参数初始化对象的属性。然后,我们创建了一个名为johnPerson类的实例,并调用了sayHello()方法。

示例2:继承类

代码语言:javascript复制
class Animal {
  constructor(name) {
    this.name = name;
  }

  eat() {
    console.log(`${this.name} is eating.`);
  }
}

class Dog extends Animal {
  bark() {
    console.log(`${this.name} is barking.`);
  }
}

const dog = new Dog('Bobby');
dog.eat(); // 输出:Bobby is eating.
dog.bark(); // 输出:Bobby is barking.

在这个示例中,我们定义了一个Animal类,它有一个属性name和一个方法eat()。然后,我们定义了一个Dog类,它通过extends关键字继承了Animal类,并添加了一个新的方法bark()

通过继承,Dog类获得了Animal类的属性和方法。我们创建了一个Dog类的实例,并调用了继承的eat()方法和自身的bark()方法。

0 人点赞