ES6中如何使用class和extends关键字实现继承?

在ES6中,可以使用class关键字来定义类,使用extends关键字来实现继承。下面是一个示例:

js 复制代码
// 父类 
class Parent {
  constructor(name) {
    this.name = name;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

// 子类 
class Child extends Parent {
  constructor(name, age) {
    super(name); // 调用父类的构造函数 
    this.age = age;
  }

  sayHello() {
    // 调用父类的方法 
    super.sayHello();
    console.log(`I am ${this.age} years old`);
  }
}

const child = new Child('Alice', 25);
child.sayHello(); // 输出: Hello, my name is Alice 
                 //       I am 25 years old 

在这个例子中,Child类继承了Parent类的所有属性和方法,并且通过super关键字调用了父类的构造函数以及sayHello方法。这样,Child类就拥有了父类的特性,同时也能够被子类进一步扩展或重写。

需要注意的是,在子类的构造函数中,必须先通过super调用父类的构造函数,才能够使用this关键字来访问子类的属性和方法。

相关推荐
M ? A4 分钟前
你的 Vue v-for,VuReact 会编译成什么样的 React 代码?
前端·javascript·vue.js·经验分享·react.js·面试·vureact
午安~婉4 分钟前
Electron桌面应用(续3)
前端·javascript·electron·重构通用模型·异步可迭代对象
W.A委员会5 分钟前
伪类与伪元素
前端·javascript·css
午安~婉5 分钟前
Electron桌面应用(续2)
前端·javascript·electron·路由守卫·优化llm返回的内容
我不是懒洋洋15 分钟前
【数据结构】栈和链表基本方法的实现
c语言·开发语言·数据结构·c++·链表·青少年编程·ecmascript
eEKI DAND29 分钟前
一个比 Nginx 还简单的 Web 服务器
服务器·前端·nginx
Highcharts.js8 小时前
Highcharts 云端渲染的真相:交互式图表与服务器端生成的边界
前端·信息可视化·服务器渲染·highcharts·图表渲染
zhuyan1089 小时前
Linux 系统磁盘爆满导致无法启动修复指南
前端·chrome
编程牛马姐9 小时前
独立站SEO流量增长:提高Google排名的优化方法
前端·javascript·网络
NotFound4869 小时前
实战指南如何实现Java Web 拦截机制:Filter 与 Interceptor 深度分享
java·开发语言·前端