Rumah >hujung hadapan web >tutorial js >Rantaian Prototaip dalam JavaScript: Memahami Pewarisan dan Carian Objek

Rantaian Prototaip dalam JavaScript: Memahami Pewarisan dan Carian Objek

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-12-22 20:49:11749semak imbas

The Prototype Chain in JavaScript: Understanding Inheritance and Object Lookup

Rantaian Prototaip dalam JavaScript

Rantai prototaip ialah konsep asas dalam model pewarisan JavaScript. Ia membenarkan objek mewarisi sifat dan kaedah daripada objek lain, dan ia merupakan mekanisme utama di sebalik cara warisan berfungsi dalam JavaScript.

Bagaimana Rantaian Prototaip Berfungsi

Apabila anda mencipta objek dalam JavaScript, ia dipautkan ke objek lain yang bertindak sebagai prototaipnya. Setiap objek mempunyai sifat dalaman tersembunyi, [[Prototaip]], yang merujuk kepada objek prototaip.

Apabila anda mengakses sifat atau kaedah pada objek, JavaScript terlebih dahulu menyemak sama ada sifat itu wujud pada objek itu. Jika tidak, JavaScript akan mencari rantai ke prototaip objek, kemudian ke prototaip prototaip itu, dan seterusnya, sehingga ia mencapai Object.prototype (akar rantai prototaip). Jika sifat atau kaedah tidak ditemui pada mana-mana peringkat rantaian, JavaScript akan kembali tidak ditentukan.

Contoh Rantaian Prototaip

// Constructor function for Animal
function Animal(name) {
    this.name = name;
}

// Adding a method to Animal's prototype
Animal.prototype.speak = function() {
    console.log(this.name + " makes a noise.");
};

// Constructor function for Dog
function Dog(name) {
    Animal.call(this, name); // Inherit properties from Animal
}

// Set up the prototype chain so Dog inherits from Animal
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog; // Reset the constructor reference

// Create an instance of Dog
const dog = new Dog("Buddy");
dog.speak();  // Output: "Buddy makes a noise."

Dalam contoh ini:

  • Objek Anjing mewarisi daripada prototaip Haiwan melalui rantai prototaip.
  • Apabila anda memanggil dog.speak(), JavaScript mula-mula mencari kaedah bercakap pada objek anjing. Jika ia tidak ditemui di sana, ia menyemak Dog.prototype, dan akhirnya Animal.prototype.
  • Memandangkan pertuturan wujud dalam Animal.prototype, ia ditemui dan dilaksanakan.

Rantaian Prototaip dan Objek.prototaip

Setiap objek dalam JavaScript akhirnya mewarisi daripada Object.prototype, yang merupakan objek prototaip paling atas dalam rantaian prototaip. Ini bermakna semua objek, termasuk contoh objek terbina dalam seperti tatasusunan, fungsi dan objek yang ditentukan pengguna, akan mempunyai akses kepada kaedah dan sifat yang ditakrifkan pada Object.prototype.

const obj = {};
console.log(obj.toString()); // Output: "[object Object]"
// The toString method is inherited from Object.prototype

Proses Carian Rantaian Prototaip

  1. Pertama, JavaScript mencari sifat atau kaedah pada objek itu sendiri.
  2. Seterusnya, jika harta itu tidak ditemui, JavaScript melihat pada prototaip objek.
  3. Kemudian, ia menyemak prototaip prototaip dan meneruskan ke atas rantai sehingga ia mencapai Object.prototype.
  4. Jika harta itu tidak ditemui walaupun dalam Object.prototype, undefined dikembalikan.

Menggambarkan Rantaian Prototaip

Pertimbangkan contoh berikut:

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

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

const john = new Person("John");

console.log(john.sayHello());  // Output: "Hello, John"
console.log(john.toString());  // Output: "[object Object]"

Dalam kes ini, rantai prototaip untuk john kelihatan seperti ini:

// Constructor function for Animal
function Animal(name) {
    this.name = name;
}

// Adding a method to Animal's prototype
Animal.prototype.speak = function() {
    console.log(this.name + " makes a noise.");
};

// Constructor function for Dog
function Dog(name) {
    Animal.call(this, name); // Inherit properties from Animal
}

// Set up the prototype chain so Dog inherits from Animal
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog; // Reset the constructor reference

// Create an instance of Dog
const dog = new Dog("Buddy");
dog.speak();  // Output: "Buddy makes a noise."
  • john tidak mempunyai kaedah toString secara langsung, jadi JavaScript melihat Person.prototype, dan jika ia tidak ditemui di sana, ia menyemak Object.prototype.
  • Akhir sekali, jika ia tidak ditemui dalam Object.prototype, ia kembali tidak ditentukan.

Kesimpulan

Rantai prototaip dalam JavaScript mendayakan keupayaan pewarisan yang berkuasa, membenarkan objek mewarisi sifat dan kaedah daripada objek lain. Memahami cara rantaian prototaip berfungsi adalah penting untuk menguasai JavaScript dan mencipta kod berorientasikan objek yang lebih cekap.

Hai, saya Abhay Singh Kathayat!
Saya seorang pembangun timbunan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.
Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.

Atas ialah kandungan terperinci Rantaian Prototaip dalam JavaScript: Memahami Pewarisan dan Carian Objek. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn