Bagaimanakah Saya Boleh Menyusun Kod JavaScript Berasaskan Prototaip Semasa Memelihara Rujukan dan Warisan Objek?

Mengatur JavaScript Berasaskan Prototaip Sambil Memelihara Rujukan dan Warisan Objek

Dilema: Menyusun Semula Kod untuk Mempertingkatkan Struktur

Warisan Prototaip ialah paradigma JavaScript yang berkuasa tetapi mengurus aplikasi besar boleh mencabar. Pertimbangkan kelas karusel dengan pelbagai fungsi:

Carousel.prototype.next = function () {...}
Carousel.prototype.prev = function () {..}
Carousel.prototype.bindControls = function () {..}

Pemfaktoran semula untuk organisasi kod yang lebih baik mungkin melibatkan pengumpulan fungsi ke dalam sub-objek:

Carousel.prototype.controls = {
   next: function () { ... } , 
   prev: function() { ... },
   bindControls: function () { .. }
}

Walau bagaimanapun, perubahan ini menimbulkan masalah: " kata kunci ini" dalam fungsi ini tidak lagi merujuk kepada contoh karusel.

Mengatasi Isu "ini"

Mengekalkan konteks "ini" adalah penting, terutamanya dalam senario di mana kelas mewarisi daripada kelas induk. Fungsi mengatasi dalam kelas yang diwarisi mesti mengekalkan tingkah laku "ini" yang betul.

Penyelesaian

Pembungkusan Sub-Objek

Satu pendekatan ialah mentakrifkan Kawalan sebagai kelas yang berasingan dan menyimpan rujukan kepada contoh karusel:

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

Sementara penyelesaian ini menangani isu "ini", ia menghalang pelaksanaan Kawalan mengatasi.

Suntikan Kebergantungan

Pendekatan yang lebih fleksibel melibatkan suntikan kebergantungan:

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

var Carousel = function () {
        this.controllers = [];
    };
Carousel.prototype.addController = function (controller) {
        this.controllers.push(controller);
    };
// ..

Dalam senario ini, kelas karusel boleh menambah berbilang pengawal, menampung berbilang set fungsi dan membolehkannya mudah mengatasi.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyusun Kod JavaScript Berasaskan Prototaip Semasa Memelihara Rujukan dan Warisan Objek?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!