Deep understanding of the JavaScript series (30): Design patterns of the appearance of the detailed knowledge of the basics

Introduced

The skin pattern (façade) provides a consistent interface for a set of interfaces in a subsystem, which defines a high-level interface that is worth the most use of the subsystem.

Body

The appearance pattern not only simplifies the interfaces in the class, but also makes the interface and the caller aware of the decoupling. The appearance pattern is often considered a prerequisite for developers, it can encapsulate some complex operations and create a simple interface for invocation.

Skin patterns are often used in JavaScript libraries, which encapsulate interfaces for multiple browsers, and the appearance pattern allows us to invoke subsystems indirectly, thus avoiding unnecessary errors caused by direct access to subsystems.

The advantage of the appearance pattern is that it is easy to use, and it is lighter in itself. But there are drawbacks. The appearance pattern is continuously used by the developer to produce a certain performance problem, because the availability of the feature is detected every time the call is called.

Here is a piece of code that is not optimized, and we use the Appearance mode to create a cross-browser usage by detecting browser features.

Copy Code code as follows:

var addmyevent = function (el, Ev, FN) {
if (El.addeventlistener) {
El.addeventlistener (EV, FN, false);
else if (el.attachevent) {
El.attachevent (' on ' + EV, FN);
} else {
el[' on ' + ev] = fn;
}
};

Another simple example is to encapsulate the other interfaces with an interface:

Copy Code code as follows:

var mobileevent = {
// ...
Stop:function (e) {
E.preventdefault ();
E.stoppropagation ();
}
// ...
};

Summarize

So when do I use the skin pattern? In general, it is divided into three stages:

First of all, in the early stages of design, you should consciously separate two layers, such as the classic three-layer structure, to create a façade between the data access layer and the business logic layer, the business logic layer, and the presentation layer.

Second, in the development phase, subsystems tend to become more and more complex because of continuous refactoring, and an increase in façade facades can provide a simple interface to reduce dependencies between them.

Third, when maintaining a large legacy system, it may be difficult to maintain the system, this time it is also very appropriate to use a facade façade, for the system to develop a façade class, for the design of rough and highly complex legacy code to provide a clearer interface, so that the new system and façade object interaction , the façade interacts with the legacy code for all the complex work.

Reference: Dahua design pattern