The Factory mode of JavaScript design mode

Factory mode is one of the most commonly used instantiation object patterns, and is a pattern that replaces the new operation with a factory method. In Factory mode, we create the object without exposing the creation logic to the client, and by using a common interface to point to the newly created object. Because the factory pattern is equivalent to creating the instance object's new, in JavaScript usually uses the new keyword to instantiate the object, such as A:a=new A (), Factory mode is also used to create the instance object, so later new will be more than the mind, whether you can consider using the Factory mode, While doing this, you may do more work, but it will give your system greater scalability and minimal modification.

Design Intent: Define an interface that creates an object so that its subclasses decide which factory class to instantiate, and the Factory mode defers its creation process to subclasses.

The main problem to solve: The main solution to the problem of interface selection.

Usage Scenarios: We explicitly plan to create different instances under different conditions.

Take a real-world example to understand the factory model: Now there is a vehicle generation company, the production of products are bicycles, motorcycles, electric cars three kinds. Market demand is constantly changing, the factory is unable to accurately determine the current market needs of the number of bicycles, motorcycles, electric vehicles. If some kind of vehicle produces too much, it will cause the stock backlog serious problem because of the sale. So the leader of the factory meeting decided: the future free in the receipt of the vehicle's specific orders to reproduce the specific vehicle, that is, if the bicycle received the order on the production of bicycles, received motorcycle orders on the production of motorcycles, received electric vehicles orders on the production of electric vehicles.

The simplest example of a factory-mode program:

varCar = (function(){                    varCar =function(model, year, miles) { This. Model =model;  This. Year =Year ;  This. Miles =miles;                    }; return function(model, year, miles) {return NewCar (model, year, miles);                };            })(); varDika =NewCar (' Dika ', 2008, 20000);

This is the simplest Factory mode and is used only to create an instance object.

Take a look at the examples of complex points:

//Factory ObjectvarFactory = (function(){                    //Factory production Management Objects    varProductmanager = {}; //Production of BicyclesProductmanager.createbicycle =function(){         This. Model = "Bicycle"; Console.log ("Product bicycle!");                    }; //Production of MotorcyclesProductmanager.createmoto =function(){         This. Model = "Moto"; Console.log ("Product moto!");                    }; //production of electric vehiclesProductmanager.createelectrocar=function(){         This. Model = "Electrocar"; Console.log ("Product electrocar!");                    }; //production functionProductmanager.create =function(type) {return NewProductmanager[type];                    }; return{Productmanager:productmanager}}) ();varTom = Factory.productManager.create ("Createmoto");

Let's look at one more example of a Web page: if we want to insert elements into a Web page, and these elements are not fixed, they may be pictures, maybe links, maybe even text, we need to define the factory class and the corresponding subclass according to the factory schema definition:

varpage = (function(){                    varDom = {}; //Subclass 1: Working with textDom. Text =function(){         This. Insert =function(where, text) {varTXT =document.createTextNode (text);        Where.appendchild (TXT);                    }    }; //Subclass 2: Working with linksDom. Link =function(){         This. Insert =function(where, url) {varlink = document.createelement ("a"); Link.href=URL;            Link.appendchild (document.createTextNode (URL));        Where.appendchild (link);                    }    }; //Subclass 3: Working with picturesDom. Image =function () {         This. Insert =function(where, url) {varimg = document.createelement (' img ')); IMG.SRC=URL;        Where.appendchild (IMG);    };                    }; //Create a functionDom.create =function(type) {return NewDom[type];                    }; return{Dom:dom}})            (); vart = page.dom.create (' Text '); T.insert (Document.body,"New text node");

Advantages and disadvantages of the factory model:

Pros: 1, a caller wants to create an object, just know its name. 2, high scalability, if you want to add a product, as long as the expansion of a factory class can be. 3, the specific implementation of shielding products, the caller only care about the interface of the product.

disadvantage: Each time you add a product, you need to add a specific class and object to implement the factory, so that the number of classes in the system multiplied, to a certain extent, increase the complexity of the system, but also increase the system specific class dependency. That's not a good thing.

The Factory mode of JavaScript design mode