Maison > interface Web > js tutoriel > le corps du texte

js modèles de conception : qu'est-ce qu'un modèle de commande ? Introduction au mode commande js

不言
Libérer: 2018-08-17 16:26:40
original
1489 Les gens l'ont consulté

Cet article vous apporte du contenu sur les modèles de conception js : Qu'est-ce que le modèle de commande ? L'introduction du mode commande js a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère que cela vous sera utile.

Qu'est-ce que le mode commande ?

Définition : Encapsule une requête dans un objet, vous permettant de paramétrer le client avec différentes requêtes.

Solution principale : Dans les systèmes logiciels, les demandeurs de comportement et les responsables de la mise en œuvre du comportement ont généralement une relation étroitement couplée, mais dans certains cas, comme la nécessité d'enregistrer, d'annuler ou ce genre de relation étroite une conception couplée qui ne peut pas résister aux changements n'est pas adaptée lors du traitement des refontes, des transactions, etc.

Quand utiliser : Dans certaines situations, telles que « enregistrement, annulation/rétablissement, transaction » et autres traitements de comportements, ce type de couplage étroit qui ne peut pas résister aux changements est inapproprié. . Dans ce cas, comment découpler le « demandeur de comportement » du « implémenteur de comportement » ? L'abstraction d'un ensemble de comportements en objets peut permettre d'obtenir un couplage lâche entre eux.

Comment résoudre : Appelez le destinataire via l'appelant pour exécuter la commande, dans l'ordre : appelant → récepteur → commande.

Code clé : Définissez trois rôles : 1. objet d'exécution de commande réel reçu 2. Commande 3. l'invocateur utilise l'entrée de l'objet de commande

commande js Avantages du modèle : 1. Réduit le couplage du système. 2. De nouvelles commandes peuvent être facilement ajoutées au système.

Inconvénients du mode commande js : L'utilisation du mode commande peut entraîner trop de commandes spécifiques pour certains systèmes.

Scénarios d'utilisation du mode commande js : Le mode commande peut être utilisé partout où une commande est considérée, par exemple : 1. Chaque bouton de l'interface graphique est une commande. 2. Simulez CMD.

Remarque : Le système doit prendre en charge l'opération d'annulation (Annuler) et l'opération de récupération (Refaire) de la commande. Vous pouvez également envisager d'utiliser le mode commande. mode.

Mode commande js

Le mode commande est également relativement simple en JavaScript Le code suivant sépare 按钮 et 命令, le mode commande peut donc être utilisé dans des projets complexes. le code et le code fonctionnel sont confiés à différentes personnes pour qu'elles les écrivent.

const setCommand = function(button, command) {
    button.onClick = function() {
        command.excute()
    }
}

// --------------------  上面的界面逻辑由A完成,下面的由B完成

const menu = {
    updateMenu: function() {
        console.log('更新菜单')
    },
}

const UpdateCommand = function(receive) {
    return {
        excute: receive.updateMenu,
    }
}

const updateCommand = UpdateCommand(menu) // 创建命令

const button1 = document.getElementById('button1')
setCommand(button1, updateCommand)
Copier après la connexion

Recommandations associées :

modèle de conception js : qu'est-ce que le modèle d'observateur (modèle de publication-abonnement) ? Introduction au modèle d'observateur js

modèle de conception js : qu'est-ce que le modèle d'itérateur ? Introduction au modèle d'itérateur js

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal