Rumah > Artikel > hujung hadapan web > Bagaimanakah Saya Boleh Menyusun Prototaip JavaScript dan Mengekalkan Konteks `ini` Semasa Pewarisan?
Mengatur Prototaip JavaScript dengan Rujukan dan Warisan Objek Terpelihara
Dalam JavaScript, menyusun kod menggunakan prototaip dan warisan boleh menjadi mencabar apabila aplikasi semakin besar . Pertimbangkan senario berikut: kami mempunyai kelas karusel dengan pelbagai fungsi:
Carousel.prototype.next = function () {...} Carousel.prototype.prev = function () {..} Carousel.prototype.bindControls = function () {..}
Untuk menambah baik organisasi kod, kami mungkin mahu mengumpulkan fungsi ini sebagai objek:
Carousel.prototype.controls = { next: function () { ... } , prev: function() { ... }, bindControls: function () { .. } }
Walau bagaimanapun, pendekatan ini memecahkan rujukan kepada objek ini, yang membawa kepada ralat apabila mewarisi daripada kelas. Untuk menangani isu ini, kita boleh meneroka strategi yang berbeza:
Mencipta Kelas Kawalan:
Satu pendekatan ialah mentakrifkan kelas Kawalan berasingan seperti berikut:
var Controls = function (controllable_object) { this.ref = controllable_object; }; Controls.prototype.next = function () { this.ref.foo(); } // .. var Carousel = function () { this.controls = new Controls(this); }; // ..
Ini membolehkan kami mengekalkan rujukan kepada objek asal, tetapi ia tidak membenarkan mengatasi pelaksanaan Kawalan.
Menggunakan Suntikan Ketergantungan:
Pendekatan yang lebih fleksibel ialah menggunakan suntikan pergantungan:
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); }; // .. var carousel = new Carousel(); carousel.addController(new Controls(carousel));
Ini membolehkan kami mencipta berbilang pengawal dan menambahkannya pada karusel secara dinamik, memberikan kefleksibelan dan keupayaan untuk mengatasi pelaksanaan.
Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyusun Prototaip JavaScript dan Mengekalkan Konteks `ini` Semasa Pewarisan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!