JavaScript three-object-oriented model-JavaScript design mode notes

1. Overview of the Singleton mode
From Baidu Encyclopedia for the definition of a singleton mode:
The singleton pattern means that there is only one instance. The singleton pattern ensures that a class has only one instance, and instantiates itself and provides this instance to the system as a whole. This class is called a singleton class.

In the JavaScript world, there is no strict object and class definition, "Everything is Object" makes JavaScript objects, not like java,c++ or PHP using a specific method to return an instance to implement, so for JavaScript, What we want to create is an object that cannot be instantiated more than once, that is, an object that can only be instantiated once.

2. Simple single-case mode:
Objects that can only be instantiated once can also be implemented using the definition of "object literals":

var singleton = {    attribute:',    method:function() {}}

Objects that are defined in this way cannot use new singleton to generate additional objects (no prototype and constructor properties exist).

3. Singleton mode with private members:
If I have read the previous article about class members, naturally we can think of using closures to implement, since the use of the closure, then must be used to function and function return value, so, such a singleton pattern is as follows:

var function () {   var private_attribute = ';   Functioin Private_method () {}   return  {     public_attribute:',     public_ Method:function() {}   };}

Do you remember the anonymous function? It is usually used when using closures and is improved as follows:

var singleton = (function() {   var private_attribute = ';   Functioin Private_method () {}   return  {     public_attribute:',     public_ Method:function() {}   };}) ();

4. Lazy Loading (lazy loading, lazy loading) singleton mode
The singleton pattern defined in 2,3 is a singleton created at the time of definition, which is a waste of memory, how can it be created when used (lazy loading, more deferred loading for images)? The so-called lazy loading, which is defined first and then created in a certain place, so you have to use the function, we know that in Java or PHP, the singleton pattern is usually created using a static method, in the same way, we can improve the closure form of the definition:

varSingleton = (function(){    varUnique; functiongetinstance () {if(!unique) {Unique=construct (); returnUnique; }    }    functionconstruct () {varPrivate_member; functionPrivate_method () {}return{//This is the real singleton.Public_member: ", Public_method:function(){}        };}) ();

This method calls a singleton object:
Singleton.getinstance (). Publicmethod ();
This will only really create a unique object when invoking a method or reference property, which is more troublesome when used:)

5. Simple MVC Code Style

By the way here I write a simple style of JS, although JS is a foreground code, but in itself, it can also be divided into MVC (Model,controller,view, about the concept of MVC, please baidu/google), So when I write the JS code of a page, I write this:
function encapsulated in this

var controller = {    init:function() {}}; // page-related content is encapsulated in this var view = {    table:{},    banner:{},    foot:{}};

Data-related content is encapsulated in this

var model = {   table_data:{}}

Call Controoler.init () when the page onload, complete initialization work (data loading, page rendering, event monitoring, etc.), so that the purpose is to try to put some of the same logic together, easy to find and modify, is only a prototype, I hope in the reading " JavaScript design pattern After this book can write a lightweight model out ^_^

JavaScript three-object-oriented model-JavaScript design mode notes