Phương thức super()

Thuộc phần Lập trình hướng đối tượng trong hành trình JavaScript của Coddy. Bài học 27 trên 56.

Phương thức super() tạo và khởi tạo đối tượng bằng hàm khởi tạo của lớp cha. Bạn phải gọi phương thức này trước khi thêm bất kỳ thuộc tính nào vào lớp con.

Hãy hình dung thế này: lớp cha xây dựng nền tảng cho đối tượng, còn super() có nghĩa là “xây dựng nền tảng đó trước” rồi lớp con mới thêm các tính năng riêng.

Hãy xem ví dụ này. Tạo một lớp cha (parent class):

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

Giờ hãy tạo một lớp con kế thừa từ lớp cha:

class Manager extends Employee {
  constructor(name, department) {
    super(name); // Gọi hàm khởi tạo (constructor) của lớp cha với name
    this.department = department;
  }
}

Điều gì đang diễn ra ở đây:

constructor(name, department) - Manager cần cả tên và phòng ban
super(name) - Truyền name cho hàm khởi tạo của Employee

this.department - Thiết lập thuộc tính riêng của Manager

Điều này tạo ra một Manager có cả thuộc tính kế thừa (name) và thuộc tính riêng (department)!

Tạo một đối tượng thuộc lớp con:

const myManager = new Manager("Sarah", "Engineering");
console.log(myManager.name);      // "Sarah"
console.log(myManager.department); // "Engineering"

Phương thức super() phải được gọi trước khi dùng this trong hàm khởi tạo của lớp dẫn xuất. Nếu bạn không gọi super(), JavaScript sẽ báo lỗi tham chiếu.

Thử thách

Cho lớp Salad kế thừa từ Meal. Salad cần có cả tên và nguyên liệu.

Nhiệm vụ của bạn là hoàn thành hàm khởi tạo của lớp Salad bằng cách:

Gọi super() với thuộc tính name
Thiết lập thuộc tính ingredients

Tự làm thử

import { Meal } from './classes.js';
import { Salad } from './classes.js';

// Đoạn code kiểm tra, đừng sửa
const salad = new Salad("Caesar", ["lettuce", "croutons", "cheese"]);
console.log(salad.name);       // Đầu ra phải là "Caesar"
console.log(salad.ingredients); // Đầu ra phải là ["lettuce", "croutons", "cheese"]