Comment puis-je organiser des prototypes JavaScript tout en préservant « ce » références et héritage ?

Organisation des prototypes JavaScript avec références et héritage préservés

Pour organiser efficacement le code lors de l'utilisation de prototypes JavaScript et de l'héritage, un problème courant se pose avec la perte de la valeur « ceci » dans les prototypes personnalisés. Dans ce problème, l'intention est d'organiser le code en compartimentant les fonctionnalités en objets imbriqués tout en conservant la référence et l'héritage.

Solution proposée :

Une approche pour résoudre ce problème est pour créer une classe dédiée à la fonctionnalité en question plutôt que de l'imbriquer directement dans le prototype lui-même.

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

var Carousel = function () {
    this.controls = new Controls(this);
};
// ..

En définissant les contrôles comme une classe distincte classe, la référence « ceci » reste intacte même au sein des prototypes personnalisés. Cependant, cette solution présente la limitation de ne pas permettre de remplacer l'implémentation des contrôles.

Solution d'injection de dépendances :

Pour permettre le remplacement des implémentations de contrôles, un Une approche d'injection de dépendances peut être utilisée :

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));

Cette solution offre de la flexibilité en permettant l'ajout et la modification dynamiques de contrôleurs, permettant ainsi la sélection sélective remplacement des fonctionnalités dans les classes héritées.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!