世外云

es6的class类如何实现继承

ES6中的class和继承是实现面向对象编程的重要特性,在ES6之前,JavaScript使用原型链来实现继承,但这种方式存在一些问题,如原型链的查找性能较低、子类实例无法访问父类私有属性等,ES6引入了class和继承的概念,使得代码更加简洁、易读,并且解决了原型链的问题。

es6的class类如何实现继承-图1

我们来看一下如何使用class来定义一个类,在ES6中,可以使用`class`关键字来定义一个类,类名通常采用大写字母开头的驼峰命名法,类中可以包含构造函数、属性和方法,构造函数用于初始化类的实例,属性用于存储类的状态,方法用于描述类的行为。

下面是一个简单的例子:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

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

在这个例子中,我们定义了一个名为`Person`的类,它有一个构造函数,接收两个参数`name`和`age`,并将它们分别赋值给实例的`name`和`age`属性,我们还定义了一个名为`sayHello`的方法,用于输出一条问候信息。

接下来,我们来看一下如何使用继承来实现代码的复用,在ES6中,可以使用`extends`关键字来实现继承,子类可以继承父类的属性和方法,并可以在子类中添加新的属性和方法,当子类调用继承自父类的方法时,会优先执行子类中的方法,如果子类中没有该方法,才会执行父类中的方法,这种机制称为方法覆盖(method overriding)。

下面是一个例子:

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.`); // 覆盖父类的speak方法
  }
}

在这个例子中,我们定义了一个名为`Animal`的基类,它有一个构造函数和一个名为`speak`的方法,我们定义了一个名为`Dog`的子类,它继承了`Animal`类,在子类的构造函数中,我们使用`super`关键字调用了父类的构造函数,将父类的实例传递给子类,我们还在子类中覆盖了父类的`speak`方法,当我们创建一个`Dog`实例并调用其`speak`方法时,会输出“🐶barks.”而不是“🐕makes a sound.”。

除了继承父类的属性和方法外,子类还可以访问父类的私有属性和方法,在ES6中,可以使用`#`符号来定义一个私有属性或方法,私有属性和方法只能在类的内部访问,不能在类的外部访问,这使得我们可以更好地保护类的内部实现细节。

class Person {
  #secret = 'I have a secret'; // 定义一个私有属性

  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  getSecret() { // 定义一个访问私有属性的方法
    return this.#secret;
  }
}

在这个例子中,我们定义了一个名为`Person`的类,它有一个私有属性`#secret`和一个访问私有属性的方法`getSecret`,由于私有属性只能在类的内部访问,因此我们不能直接访问它,通过调用`getSecret`方法,我们可以间接地获取到私有属性的值,需要注意的是,虽然我们可以访问私有属性的值,但我们无法修改它的值,如果我们尝试修改私有属性的值,将会抛出一个错误。

总结一下,ES6中的class和继承提供了一种更加简洁、易读的方式来实现面向对象编程,通过使用class和extends关键字,我们可以方便地定义类、创建实例、实现继承和覆盖方法等功能,ES6还支持私有属性和方法,使得我们可以更好地保护类的内部实现细节。

分享:
扫描分享到社交APP
上一篇
下一篇
发表列表
请登录后评论...
游客 游客
此处应有掌声~
评论列表

还没有评论,快来说点什么吧~