Detailed explanation of the command pattern of JS design patterns

This time I will bring you a detailed explanation of the Command Mode of JSDesign Pattern. What are the Notes for using the JS Command Mode. Here are the actual cases. , let’s take a look.

Concept
The command mode is used to encapsulate a request into an object, so that the client can be parameterized with different parameters. This mode encapsulates the function call request and operation into a single object. Then this object is processed in a single process, which is divided into three objects in short:
1. Initiator: Just issue the calling command. It is not clear how to execute it and who will execute it.
2. Receiver: There are corresponding interfaces to process different commands. As for what the command is and who issued it, it doesn’t matter.
3. Command object: As we said above, we separated the initiator and the receiver, and this requires this bridge to link it. This is the command object. The command object accepts the call from the sender, = and then calls the receiver. corresponding interface.

Function and precautions
Function:
1. Combine encapsulation, request, and call into one.
2. Improve the flexibility of program modularization.
Notes:
There is no need for consistent excuses, just call the function directly to avoid waste.

Example

   // 发送者 
            var setCommond = function(button, fn) { 
                button.onClick = function() { 
                    fn() 
                } 
            }; 
            // 执行命令者 
            var menu = { 
                reFresh: function() { 
                    console.log("刷新"); 
                }, 
                add: function() { 
                    console.log("增加"); 
                }, 
                delete: function() { 
                    console.log("删除"); 
                } 
            }; 
            // 命令对象 
            var commondObj = function(reciver) {
                return function() { 
                    reciver.reFresh(); 
                } 
            }; 
            var commondObj1 = commondObj(menu); 
            setCommond(btn1, commondObj1);

Sender (setCommond): It doesn’t matter which button it is given to or what event it is bound to, as long as it is passed in through parameters.
Command object (commondObj): It only needs to receive the parameters of the recipient, and when the sender issues the command, it will be executed.
Receiver (menu): Don’t care where it is called and by whom, just execute it as needed.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Detailed Explanation of the Builder Pattern of JS Design Patterns

Detailed Explanation of the Constructor Pattern of JS Design Patterns

js design pattern - the use of singleton pattern

The above is the detailed content of Detailed explanation of the command pattern of JS design patterns. For more information, please follow other related articles on the PHP Chinese website!