在 JavaScript 中,每個物件都有一個隱藏的屬性,稱為 [[Prototype]]。這個屬性指向另一個物件,即該物件的原型(prototype)。通過這種原型機制,JavaScript 可以實現物件之間的屬性和方法繼承。
原型鏈(Prototype Chain):每個物件的 [[Prototype]] 都是一個物件,如果在一個物件中找不到某個屬性或方法,JavaScript 會沿著這個原型鏈向上查找,直到找到該屬性或方法,或者到達鏈的頂端(即 null)。這種機制被稱為原型鏈。
proto 屬性:proto 是用來訪問物件的 [[Prototype]] 的一個屬性。儘管大多數 JavaScript 引擎都支持 proto,但在實際開發中更推薦使用標準的方法,如 Object.getPrototypeOf(obj) 和 Object.setPrototypeOf(obj, prototype)。
共享方法的好處:將方法定義在原型上,所有的實例物件都可以共享這些方法,從而節省內存。例如,在用 function 定義構造函數時,可以將通用的方法添加到其 prototype 上,這樣所有該構造函數的實例都可以訪問這些方法。
實際應用上:
以下是一些實戰中常見的應用場景及注意事項:
function Person(name) {
this.name = name;
}
Person.prototype.greet = function() {
console.log(`Hello, my name is ${this.name}`);
};
const alice = new Person('Alice');
const bob = new Person('Bob');
alice.greet(); // Hello, my name is Alice
bob.greet(); // Hello, my name is Bob
function Animal(name) {
this.name = name;
}
Animal.prototype.eat = function() {
console.log(`${this.name} is eating`);
};
function Dog(name, breed) {
Animal.call(this, name); // 繼承屬性
this.breed = breed;
}
Dog.prototype = Object.create(Animal.prototype); // 繼承方法
Dog.prototype.constructor = Dog;
Dog.prototype.bark = function() {
console.log(`${this.name} is barking`);
};
const myDog = new Dog('Buddy', 'Golden Retriever');
myDog.eat(); // Buddy is eating
myDog.bark(); // Buddy is barking