This article describes the principles and applications of JavaScript design patterns – factory patterns. Share it for your reference, as follows:
introduce:We introduced the simple factory model earlier. There is a serious problem with the simple factory model: when it is necessary to expand, the source code of the factory class must be modified. Although we have made some optimizations in the second demo, we need to specify the name of the execution method when using it, which undoubtedly increases the cost of use. So how to add new products without affecting existing code? The factory model came into being.
definition:Define an interface for creating objects, letting the subclass decide which class to instantiate. Factory pattern delays the instantiation of a class to its subclasses. The factory mode is also called the factory method mode, and can also be called the virtual constructor mode or the polymorphic factory mode. Factory mode is a type creation mode.
Scene:It is still based on the simple factory model scenario. We try to use factory model to solve the problem of pop-ups.
Example:
var Dialog = function(){
= function(){
( + ' is show -> ' + );
}
};
= function(){
var _dialog = new Dialog();
_dialog.element = '<div>notice</div>';
_dialog.name = 'notice';
return _dialog;
};
= function(){
var _dialog = new Dialog();
_dialog.element = '<div>toast</div>';
_dialog.name = 'toast';
return _dialog;
};
= function(){
var _dialog = new Dialog();
_dialog.element = '<div>warnin</div>';
_dialog.name = 'warnin';
return _dialog;
};
var Factory = {};
= function(){
return ();
}
= function(){
return ();
}
= function(){
return ();
}
var notice = ();
var toast = ();
var warnin = ();
(); //notice is show -> <div>notice</div>
(); //toast is show -> <div>toast</div>
(); //warnin is show -> <div>warnin</div>
Compared with the simple factory model, what problems does the factory model solve?
The most important thing is to split the factory method in the simple factory mode
Transfer to its subclass, that is, createToast method,
When all factory entrances were dismantled into independent factory categories, the previous simple factory model required modification of the factory category when it was added, which violated the switching principle
Factory model ensures that only add and not modify when adding
When the project is large enough, you can split the subclasses of Factory and Dialog into files for management
During the period when I was writing the factory model, I checked some information and found that everyone has their own understanding
Some of the factory model demos I saw are more like the simple factory model we introduced earlier. Why?
Our demo refers to Java books, which contains the concept of abstract classes. It can only be described by your own understanding at the front end.
So we try our best to introduce each model through some differences
The examples here may not be particularly rigorous. I will slowly optimize them later. I will write more details and only have one purpose.
When someone asked me one day what is the difference between a simple factory model and a factory model, I hope I can give me a understanding
Factory model summary:
advantage:
* When adding new products, there is no need to modify existing codes
* Only factory classes are exposed, and the specific implementation is encapsulated internally. There is no need to pay attention to internal use when using it.
shortcoming:
* When adding, it is still necessary to add specific implementations and provide specific factory categories, which increases the system complexity to a certain extent and will bring some additional overhead.
* Only one product is produced in each factory, which will lead to a large number of factory categories, greatly increasing the system maintenance cost and operating expenses.
Interested friends can use itOnline HTML/CSS/JavaScript code running tool：http://tools./code/HtmlJsRunTest the above code running effect.
For more information about JavaScript, readers who are interested in reading this site's special topic:JavaScript object-oriented tutorial》、《Summary of JavaScript Errors and Debugging Skills》、《Summary of JavaScript data structure and algorithm techniques》、《JavaScript traversal algorithm and skills summary"and"Summary of JavaScript mathematical operations usage》
I hope this article will be helpful to everyone's JavaScript programming.