Hàm tạo lớp JavaScript
Thí dụ
Tạo một lớp Xe, sau đó tạo một đối tượng có tên "mycar" dựa trên lớp Xe:
class Car {
constructor(brand) { // Constructor
this.carname = brand;
}
}
mycar = new Car("Ford");
Thêm các ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và Cách sử dụng
Phương constructor()
thức là một phương thức đặc biệt để tạo và khởi tạo các đối tượng được tạo trong một lớp.
Phương constructor()
thức được gọi tự động khi một lớp được khởi tạo và nó phải có tên chính xác là "constructor", trên thực tế, nếu bạn không có phương thức constructor, JavaScript sẽ thêm một phương thức constructor vô hình và trống.
Lưu ý: Một lớp không thể có nhiều hơn một phương thức constructor (). Điều này sẽ ném a SyntaxError
.
Bạn có thể sử dụng super()
phương thức này để gọi hàm tạo của lớp cha (xem phần "Ví dụ khác" bên dưới).
Hỗ trợ trình duyệt
constructor()
là một tính năng ECMAScript6 (ES6).
ES6 (JavaScript 2015) được hỗ trợ trong tất cả các trình duyệt hiện đại:
Chrome | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes |
constructor()
không được hỗ trợ trong Internet Explorer 11 (hoặc phiên bản cũ hơn).
Cú pháp
constructor(parameters)
Chi tiết kỹ thuật
Phiên bản JavaScript: | ECMAScript 2015 (ES6) |
---|
Các ví dụ khác
Để tạo kế thừa lớp, hãy sử dụng extends
từ khóa.
Một lớp được tạo với kế thừa lớp sẽ kế thừa tất cả các phương thức từ một lớp khác:
Thí dụ
Tạo một lớp có tên "Model" sẽ kế thừa các phương thức từ lớp "Car":
class Car {
constructor(brand) {
this.carname =
brand;
}
present() {
return 'I have a ' + this.carname;
}
}
class Model extends Car {
constructor(brand, mod) {
super(brand);
this.model = mod;
}
show() {
return this.present() + ', it is a ' + this.model;
}
}
mycar = new Model("Ford", "Mustang");
document.getElementById("demo").innerHTML
= mycar.show();
Phương super()
thức tham chiếu đến lớp cha.
Bằng cách gọi super()
phương thức trong phương thức khởi tạo, chúng ta gọi phương thức khởi tạo của cha và nhận quyền truy cập vào các thuộc tính và phương thức của cha.
Các trang liên quan
Hướng dẫn JavaScript: Các lớp JavaScript
Hướng dẫn JavaScript: JavaScript ES6 (EcmaScript 2015)
Tham khảo JavaScript: Từ khóa mở rộng
Tham khảo JavaScript: Từ khóa siêu cấp