首页 > web前端 > js教程 > 正文

如何实现继承_javascript中类的继承方式有哪些?

夜晨
发布: 2025-12-12 19:21:24
原创
155人浏览过
JavaScript类继承通过extends实现,底层基于原型链;子类需在constructor中调用super()初始化父类this,super可传参并支持方法重写、静态方法及内置类继承。

如何实现继承_javascript中类的继承方式有哪些?

JavaScript 中类的继承主要通过 extends 关键字 实现,这是 ES6 引入的语法糖,底层仍基于原型链。它让子类能复用父类的属性和方法,并支持重写、扩展逻辑。

使用 extends 和 super 实现基础继承

子类通过 extends 声明继承父类,构造函数中必须调用 super()(否则报错),以初始化父类的 this。super() 相当于执行父类 constructor。

  • 不调用 super():子类构造函数中无法访问 this,会直接报 ReferenceError
  • super() 必须在使用 this 之前调用
  • super 可以传参,这些参数会传给父类 constructor

示例:

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() { console.log(`${this.name} 发声`); }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // 初始化父类 this
    this.breed = breed;
  }
  speak() { console.log(`${this.name} 汪汪!`); }
}

方法重写与 super 调用父类方法

子类可定义同名方法覆盖父类逻辑;若需在子类方法中调用父类版本,用 super.方法名()

立即学习Java免费学习笔记(深入)”;

Ghiblio
Ghiblio

专业AI吉卜力风格转换平台,将生活照变身吉卜力风格照

Ghiblio 157
查看详情 Ghiblio
  • super 不仅可用于 constructor,也可用于普通方法和 getter/setter
  • super 指向父类的原型对象(即 Parent.prototype),不是父类实例
  • 静态方法中 super 指向父类本身(Parent)

例如:speak() { super.speak(); console.log('然后摇尾巴'); }

静态方法与继承关系

static 方法也会被继承。子类可通过 子类名.静态方法 调用父类静态方法,也可用 super.静态方法 在子类静态方法中调用父类版本。

  • class A { static foo() { return 'A'; } }
    class B extends A {}
    B.foo(); // 'A'
  • class C extends A { static foo() { return super.foo() + ' + C'; } }

继承内置类(如 Array、Error)

extends 可继承原生构造函数,使自定义类拥有内置行为(如 instanceof 正确、数组方法可用)。

  • class MyArray extends Array {}
    const arr = new MyArray(1, 2);
    arr.map(x => x * 2); // ✅ 正常工作
  • 注意:某些内置类(如 Promise)在旧环境可能有兼容性限制,但现代引擎普遍支持

基本上就这些。虽然语法简洁,但理解 super 的绑定时机和 this 的初始化顺序很关键——它不是魔法,只是对原型链和 [[Construct]] 的封装。

以上就是如何实现继承_javascript中类的继承方式有哪些?的详细内容,更多请关注php中文网其它相关文章!

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号