extends
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2016.
extends 關鍵字被使用於類別（class）宣告或類別（class）表達式中來建立擴展的子類別 。
嘗試一下
class DateFormatter extends Date { getFormattedDate() { const months = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", ]; return `${this.getDate()}-${months[this.getMonth()]}-${this.getFullYear()}`; } } console.log(new DateFormatter("August 19, 1975 23:15:30").getFormattedDate()); // Expected output: "19-Aug-1975" 語法
class ChildClass extends ParentClass { ... } 解釋
範例
使用 extends
第一個範例是根據 Polygon類別建立一個名為 Square 的子類別。此範例提取自線上示例。
js
class Square extends Polygon { constructor(length) { // Here, it calls the parent class' constructor with lengths // provided for the Polygon's width and height super(length, length); // Note: In derived classes, super() must be called before you // can use 'this'. Leaving this out will cause a reference error. this.name = "Square"; } get area() { return this.height * this.width; } } 使用 extends 於內建類別
這個範例擴展了內建的 Date 類別。此範例提取自線上範例。
js
class myDate extends Date { constructor() { super(); } getFormattedDate() { var months = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", ]; return ( this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear() ); } } 擴展 null
像擴展普通類別一樣擴展 null，但新對象的原型不會繼承 Object.prototype。
js
class nullExtends extends null { constructor() {} } Object.getPrototypeOf(nullExtends); // Function.prototype Object.getPrototypeOf(nullExtends.prototype); // null new nullExtends(); //ReferenceError: this is not defined 標準
| Specification |
|---|
| ECMAScript® 2026 Language Specification # sec-class-definitions |