JavaScript design mode--monomer mode

<! DOCTYPE html>


<meta charset= "UTF-8" >
<title> Test Documentation </title>
<script>
///Monomer mode definition: A class that can only be instantiated once, and provides a well-known global access point.
//The role of the monomer mode: Object-oriented programming is the way to think about the actual life of the specific object abstraction. ———— is modeled
//For real life, a lot of objects only one is very important. For example, a company can have only one accounting system, and a digital filter can have only one ADC
//A computer should have only one file system and a window manager. In the world of abstract object-oriented programming, some classes should have only one instance.
///Monomer Mode implementation: Let the class itself be responsible for saving its only instance. (This class guarantees that only one instance can be created, and there is a way to access the instance)
//
//The implementation of the monomer mode in JS has two ways. One, the object literal. Two, closures.

//
//Mode one: Using the object literal form of the monomer
//There is no concept of class in JS. JS is an object instantiated through an object.
///So you can think of Singleton as a class and implement a unique object. (may be a bit around)
In addition, we can implement access to the instance through the Singleton.name,singleton.getname and other dot operators.
//object literal creation of the monomer application. ———— Package
//Encapsulation ———— use of namespaces
//By encapsulating data and methods inside an object
//This protects the external variable with the same name from accidental rewriting. When the local code is used as a third-party JS Library, it does not affect the other's local code variables. The role of ———— namespaces
//Assume this is a variable defined in the third-party JS library loaded
var name= ' Elvis ';
//Local JS code
var singleton={
name: ' Byronvis ',
getname:function () {
alert (this.name);//Sometimes it goes wrong
alert (singleton.name);//preferably using this method
            }
        };
singleton.getname ();

it is easy to accidentally rewrite a variable without using the monomer mode
//Assume this is a variable defined in the third-party JS library loaded
var name= "Elvis";
//Local JS code
var name= ' byronvis ';//accidentally rewrite the object of the third-party JS library
var getname=function () {
alert (name);
        };
getName ();
//Package ———— code wrapper
//In websites with many web pages, some JS code is required for all pages, and they are usually placed in separate files .
//And some of the code is specific to a Web page and will not be used elsewhere. It is best to wrap the two codes separately in your own monomer.
//In other words, it is possible to encapsulate several infrequently used function blocks in a single monomer.

//Mode two: Create monomers through closures.
//The monomer created by the object literal has some drawbacks. Is that the data and methods of a single object are public and have no private properties.
//The private properties of the object can be implemented by closing the package.
secondsingleton= (function () {
private data for the//object
var name= ' Elvis ';
//Private method of the object
function SetName () {
name= ' Byron '
            }
return {
//object's public data
Location : ' Hangzhou ',
the privileged method of the//object
getlocation:function () {
alert (this.location);
                },
getname:function () {
alert (name);
                }
            };
        })();
secondsingleton.getname ();
//Closures to create a single application. ———— Branch
//The role of the branch:
//There is a difference between browsers. Different browsers have different implementations for a feature
//We encapsulate the implementation of each browser, and dynamically decide which method to use to implement the function when the page loads the JS file, either through a competency test or browser sniffing.
_secondsingleton= (function () {
var obja={
age:22,
getage:function () {
alert (' Age: ' +this.age);
                }

            };
var objb={
age:23,
getage:function () {
alert (this.age);
                }
            };
//Constraints to achieve the root of the branch
return (2>1)? OBJA:OBJB;
        })();
_secondsingleton.getage ();
//Inert instantiation monomer
////The monomer created in the previous two ways has one thing in common, when the Web page loads the JS file, the monomer is instantiated immediately.
//(since the object literal is defined directly in the global context, the function of the closure method is also defined immediately after execution)
//For large monomer instances, we sometimes want to instantiate them when they are used, and do not want to instantiate the resource too early.
///This time you need to instantiate the monomer lazily.
///lazy instantiation of the monomer idea: closure embedded closed Package
//The constructor for the instance encloses the enclosing envelope with a closure.
//The constructor is controlled by the privileged method of the outer closure.
//The property method of accessing the monomer at this time has changed.
///It can also be seen that the main disadvantage of inert instanced monomers is complexity. Less intuitive than the first two.
thirdsingleton= (function () {
//private variable to save the instance
var instance;
return{
//Call instantiation Method (this method implements the time control of the instantiated monomer)
getinstance:function () {
instantiate an object if the instance does not exist
if (!instance) {
instance=constructor ();
                    }
//Returns an instance if the instance exists
return instance;
                }

            };
//constructor for singleton instance
function Constructor () {
private data for the//object
var name = ' Elvis ';
//Private method of the object
function SetName () {
name = ' Byron '
                }

return {
//object's public data
Location : ' Hangzhou ',
the privileged method of the//object
getlocation:function () {
alert (this.location);
                    },
getname:function () {
alert (name);
                    }
                }
            }
        })();
//The method of accessing the properties of the monomer changes, must have the getinstance () prefix
thirdsingleton.getinstance (). GetLocation ();



</script>

<body>
This is really just a test document AH.
</body>

JavaScript design mode--monomer mode