当前位置:首页 > JavaScript

extends实现js

2026-04-05 05:07:55JavaScript

extends实现js

使用 extends 实现 JavaScript 继承

在 JavaScript 中,extends 关键字用于实现类之间的继承。通过 extends,子类可以继承父类的属性和方法,并可以扩展或重写父类的功能。

extends实现js

基本语法

class Parent {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, ${this.name}!`);
  }
}

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

  greet() {
    super.greet(); // 调用父类的 greet 方法
    console.log(`You are ${this.age} years old.`);
  }
}

const child = new Child('Alice', 10);
child.greet();

关键点说明

  • super 关键字:在子类的构造函数中必须调用 super(),否则会报错。super 用于调用父类的构造函数或方法。
  • 方法重写:子类可以重写父类的方法,同时通过 super.methodName() 调用父类的原始方法。
  • 继承链extends 支持多级继承,子类可以进一步被其他类继承。

继承内置对象

extends 也可以用于继承 JavaScript 内置对象(如 ArrayError 等)。

class CustomArray extends Array {
  getFirst() {
    return this[0];
  }

  getLast() {
    return this[this.length - 1];
  }
}

const arr = new CustomArray(1, 2, 3);
console.log(arr.getFirst()); // 1
console.log(arr.getLast());  // 3

注意事项

  • 子类的 constructor 必须调用 super(),否则会抛出错误。
  • 静态方法也会被继承,可以通过 super 调用父类的静态方法。
  • extends 右侧可以是任何具有 prototype 属性的表达式(如函数、类等)。

标签: extendsjs
分享给朋友:

相关文章

js实现分页

js实现分页

分页的基本实现思路 在JavaScript中实现分页功能通常需要结合前端和后端逻辑。前端负责渲染分页控件和处理用户交互,后端负责提供分页数据。 前端分页实现 纯前端分页适用于数据量较小的情况,可以直…

js实现打印

js实现打印

使用window.print()方法实现打印 在JavaScript中,可以通过调用window.print()方法直接触发浏览器的打印功能。这会打开系统的打印对话框,用户可以选择打印机和设置打印选项…

js实现驼峰

js实现驼峰

实现驼峰命名的几种方法 使用正则表达式和字符串替换 通过正则表达式匹配字符串中的特定模式(如下划线或短横线),并将其后的字母转换为大写,同时移除分隔符。 function toCamelCase(s…

js实现交换

js实现交换

交换变量的方法 在JavaScript中,交换两个变量的值有多种方法。以下是常见的几种实现方式: 使用临时变量 通过引入一个临时变量来存储其中一个变量的值,实现交换: let a = 1; le…

js实现显示隐藏

js实现显示隐藏

显示隐藏的实现方法 在JavaScript中,实现元素的显示和隐藏可以通过多种方式完成。以下是几种常见的方法: 修改CSS的display属性 通过改变元素的display属性可以在none(隐藏)…

实现继承js

实现继承js

实现继承的方式 在JavaScript中,实现继承可以通过多种方式完成,每种方式都有其优缺点。以下是几种常见的实现继承的方法: 原型链继承 原型链继承是最基本的继承方式,通过将子类的原型指向父类的实…