JavaScript design mode reading note Four (simple interest mode)

1. Introduction to the simple interest model

The simple interest pattern in design mode is a relatively simple pattern, defined as follows:

Make sure that there is only one instance of a class, and instantiate it yourself and provide this instance to the entire system.

In JavaScript, the code is organized into a unit that can be accessed through a single variable to ensure that there is only one instance of the object.

Monomer classes can be used in JavaScript to divide namespaces and reduce the number of global variables in a Web page.

Summary: In fact, all the code is encapsulated into a class, accessed through this class access. It's like a TV remote that's common in life. The required operations are encapsulated in the remote control, access to the TV, directly through the remote control operation.

2. Basic structure

The object literal we usually use is the so-called simple interest pattern, because it organizes a number of related properties and methods together.

<span style= "FONT-FAMILY:SIMSUN;FONT-SIZE:18PX;" >//Create Properties and methods for objects in the form of object literals        var Singleton = {            attribute1:true,            attribute2:10,            //Method one            method1: function () {            },            //Method two            method2:function (ARG) {            }        };        Modify Object Properties        Singleton.attribute1 = false;        var total = Singleton.attribute2 + 5;        Read Object method        var result = Singleton.method1 ();</span>

In the above code, all the variables and methods must be accessed through the Singleton object, and you can expand the object. Of course, this also violates the "design mode" in the opening and closing principle, if you really want to include some private variables, you can use function nesting, that is, the operation of closures.

3. Partitioning namespaces

As the definition of the Monomer object shows: The internal members of all the monomer objects are wrapped in this monomer object, and these members can only be accessed through these monomer object variables. So our usual namespaces can do this.

<span style= "FONT-FAMILY:SIMSUN;FONT-SIZE:18PX;" >//define a Global object        //define a company's global object        var business = {                   };        You can then organize your own code into the individual objects of this global object monomer//        company's management department        business.adminstration = {         //method one            method1:function () {                         }        };        Operating Department of the company        business.operation = {            //Method two            method2:function () {            }        };        Advertising Department of the company        business.advertisement = {            //Method three            method3:function () {            }        };        Business.Adminstration.method (); Call        var a = new business () correctly;  Not a constructor        A.adminstration.method ();  Error</span>

By categorizing the different code to do the planning process, put it into different namespaces, which will reduce the error of the program. As shown in the code above, first set up a company's global object, and then classify the various parts of the division, the responsibilities are clearly divided, reducing the relationship between objects, reducing the likelihood of error.

4. Using closures

The concept of closing a package has been mentioned in the previous blog. In closures, variables and functions are defined within the constructor to make them private members, and a privilege-like function is defined to achieve the purpose of external access to these private members, but we know that when using a closure instantiation class, all the methods and properties of life within the constructor will be created again, This is also the disadvantage of closures.

Because the monomer is only instantiated once, you don't have to worry about how many methods and properties are declared within the constructor because all methods and properties are instantiated only once.

<span style= "FONT-FAMILY:SIMSUN;FONT-SIZE:18PX;" > <script>        Mynamespace.singleton = (function () {            //Private member            var privateAttribute1 = false;            var privateAttribute2 = [1, 2, 3];              function PrivateMethod1 () {                           }            function privateMethod2 (args) {                            }            //closure            return {                 Publicattribute1:true,                publicattribute2:10,                    publicmethod1:function () {                                   },                publicMethod2: function (args) {                                    }            };        }) ();    </script></span>

The private variables inside the object can be accessed through the operation of the monomer plus the closure package.

5. Deferred instantiation

Since the monomer object is created when the script is loaded, if we do not need the monomer when loading, then what should we do to postpone the loading of the monomer object?

In fact, we just add a static method to declare when to call.

<span style= "FONT-FAMILY:SIMSUN;FONT-SIZE:18PX;" > <script>               /* Monomer Object */        Mynamespace.singleton = (function () {              var uniqueinstance;//Private attribute that holds the single instance.              function constructor () {//Specific code details                         }              return {/                * used to implement lazy loading */                getinstance:function () {                    if (! Uniqueinstance) {//judgment only and only one monomer object                        Uniqueinstance = Constructor ();                    }                    return uniqueinstance;}}        ) ();         </script></span>

In fact, compared with the above, the main operation is more than a static method, used to achieve the judgment and delay loading.

6. Summary

This blog mainly explains the application of the monomer mode in JavaScript, through the use of JavaScript mode, you can organize the code, the relevant methods and properties in a non-instantiated monomer, in order to facilitate our future maintenance. This is the benefit of the monomer model.

If you want to know more about the monomer model, please see the blog.

Single-Case mode

JavaScript design mode reading note Four (simple interest mode)