In depth understanding of JavaScript series (34) : command mode details for design patterns

  • 2020-05-10 17:40:51
  • OfStack

introduce

The command mode (Command) is defined as: to encapsulate a request into an object, so that you can parameterize customers with different requests; Queue or log requests and perform revocable operations on requests. In other words, the change mode is designed to encapsulate the function calls, requests, and operations into a single one object, which is then processed in series 1. In addition, you can decouple the command object from the receiving object by calling the object that implements the specific function.

The body of the

Let's demonstrate this pattern through the vehicle purchase program. First, define the specific operation class of vehicle purchase:


$(function () {     var CarManager = {         // Request information
        requestInfo: function (model, id) {
            return 'The information for ' + model +
        ' with ID ' + id + ' is foobar';
        },         // Buying a car
        buyVehicle: function (model, id) {
            return 'You have successfully purchased Item '
        + id + ', a ' + model;
        },         // organization view
        arrangeViewing: function (model, id) {
            return 'You have successfully booked a viewing of '
        + model + ' ( ' + id + ' ) ';
        }
    };
})();

Take a look at the code above and simply execute the manager command by calling the function, however in this case we don't want to call the method directly inside the object. This increases dependencies between objects. Now let's extend the CarManager to 1 so that it can accept any processing requests from CarManager objects including model and car ID. According to the definition of the command pattern, we want to implement the following function invocation:


CarManager.execute({ commandType: "buyVehicle", operand1: 'Ford Escort', operand2: '453543' });

According to this requirement, we can implement the CarManager.execute method like this:

CarManager.execute = function (command) {
    return CarManager[command.request](command.model, command.carID);
};

After the transformation, the call is much simpler, and the following calls can be implemented (of course, some abnormal details still need to be improved 1) :

CarManager.execute({ request: "arrangeViewing", model: 'Ferrari', carID: '145523' });
CarManager.execute({ request: "requestInfo", model: 'Ford Mondeo', carID: '543434' });
CarManager.execute({ request: "requestInfo", model: 'Ford Escort', carID: '543434' });
CarManager.execute({ request: "buyVehicle", model: 'Ford Escort', carID: '543434' });

conclusion

The command pattern makes it easier to design a command queue, to log commands when required, and to allow the 1 party that accepts the request to decide if it needs to be called, to undo and reset requests, and to do so because the new concrete classes do not affect other classes.

But agile development principle tells us that don't add based on speculation, actually don't need to code the function, if you don't know whether you need a system command mode, you don't try so hard to achieve it as a 1, in fact, when demand through refactoring implements this pattern is not difficult, only the real requirements such as undo and restore operation function, the original code refactoring to command mode.


Related articles: