2 Prototype & Prototype Chain

Prototype là gì?

Prototype là một đối tượng ẩn mà mỗi đối tượng trong JavaScript kế thừa từ đó. Khi bạn truy cập một thuộc tính hoặc phương thức của đối tượng, JavaScript sẽ:

Tìm trong chính đối tượng
Nếu không thấy → tìm trong prototype của đối tượng đó
Tiếp tục đi qua prototype chain cho đến khi tìm thấy hoặc gặp null

Prototype của một Object

function Person(name) {
    this.name = name;
}

Person.prototype.sayHello = function() {
    console.log("Hello, " + this.name);
};

let john = new Person("John");
john.sayHello(); // "Hello, John"

Tìm trong john

sayHello không có trong john trực tiếp

Tìm trong Prototype

JavaScript tìm thấy sayHello trong Person.prototype

Prototype Chain (cốt lõi)

Prototypal Inheritance cho phép đối tượng kế thừa thuộc tính và phương thức từ đối tượng khác thông qua prototype. Thay vì tạo lại phương thức trong mỗi đối tượng, bạn tạo chúng một lần trong prototype và tất cả đối tượng kế thừa sẽ sử dụng được.

function Animal(name) {
    this.name = name;
}

Animal.prototype.speak = function() {
    console.log(this.name + " makes a sound");
};

function Dog(name, breed) {
    Animal.call(this, name); // Gọi constructor của Animal
    this.breed = breed;
}

// Kế thừa từ Animal
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

Dog.prototype.bark = function() {
    console.log(this.name + " barks");
};

let dog1 = new Dog("Buddy", "Golden Retriever");
dog1.speak(); // "Buddy makes a sound" (kế thừa từ Animal)
dog1.bark();  // "Buddy barks" (phương thức riêng của Dog)

class Animal {
    constructor(name) {
        this.name = name;
    }
    speak() {
        console.log(`${this.name} makes a sound`);
    }
}

class Dog extends Animal {
    constructor(name, breed) {
        super(name);
        this.breed = breed;
    }
    bark() {
        console.log(`${this.name} barks`);
    }
}

let dog1 = new Dog("Buddy", "Golden Retriever");
dog1.speak(); // "Buddy makes a sound"
dog1.bark();  // "Buddy barks"

Chuỗi Prototype Chain

Khi truy cập dog1.speak():

dog1 → Dog.prototype → Animal.prototype → Object.prototype → null

Bước 1

Tìm speak trong dog1 → không có

Bước 2

Tìm trong Dog.prototype → không có

Bước 3

Tìm trong Animal.prototype → tìm thấy!