Bản dịch này đang trong quá trình.

Từ khóa extends được sử dụng trong khai báo class hoặc trong class expressions để tạo ra 1 class con là con của class khác

Cú pháp

class ChildClass extends ParentClass { ... }

Mô tả

Từ khó extends có thể được sử dụng để tạo ra class con từ những class mà chúng ta tạo ra hoặc những class sẵn có

Thuộc tính .prototype của lớp được kế thừa phải trả về giá trị là  Object hoặc null.

Ví dụ

Sử dụng extends

Ở ví dụ đầu tiên tạo ra 1 class Square từ class Polygon. Ví dụ này được lấy từ  đây (source).

class Square extends Polygon {
  constructor(length) {
    // Ở đây, gọi 1 constructor từ class cha với tham số truyền vào là length
    // cung cấp chiều rộng vào chiều cao của class Polygon 
    super(length, length);
    // Chú ý: trong những class con, super()  phải được gọi trước khi
    // bạn có thể sử dụng từ khóa 'this'. Nếu không sẽ gây ra lỗi tham chiếu
    this.name = 'Square';
  }

  get area() {
    return this.height * this.width;
  }
}

Sử dụng extends với những object có sẵn

Trong ví dụ này chúng ta thừa kế từ object có sẵn là Date . Ví dụ này được lấy từ đây(source).

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();
  }
}

Thừa kế từ null

Thừa kế từ null cũng giống như class thông thường, ngoại trừ rằng các prototype của object sẽ không được thừa kế từ Object.prototype.

class nullExtends extends null {
  constructor() {}
}

Object.getPrototypeOf(nullExtends); // Function.prototype
Object.getPrototypeOf(nullExtends.prototype) // null

new nullExtends(); //ReferenceError: this is not defined

Thông số kĩ thuật

Thông số Trạng thái Bình luận
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'extends' in that specification.
Standard Initial definition.
ECMAScript Latest Draft (ECMA-262)
The definition of 'extends' in that specification.
Draft  

Trình duyệt tương thích

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
extendsChrome Full support 49
Notes
Full support 49
Notes
Notes From Chrome 42 to 48 strict mode is required. Non-strict mode support can be enabled using the flag "Enable Experimental JavaScript".
Edge Full support 13Firefox Full support 45IE No support NoOpera Full support 36Safari Full support 9WebView Android ? Chrome Android Full support YesEdge Mobile Full support 13Firefox Android Full support 45Opera Android ? Safari iOS Full support 9Samsung Internet Android Full support Yesnodejs Full support 6.0.0
Full support 6.0.0
Full support 4.0.0
Disabled
Disabled From version 4.0.0: this feature is behind the --use_strict runtime flag.
Full support 5.0.0
Disabled
Disabled From version 5.0.0: this feature is behind the --harmony runtime flag.

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.

Bài viết liên quan

Document Tags and Contributors

Những người đóng góp cho trang này: hiep1bg
Cập nhật lần cuối bởi: hiep1bg,