JS Five design modes

1. JS Factory mode

　　

1 varlev=function(){2        return"Hey, ha."; 3 };4 functionParent () {5     varChild =Newobject ();6Child.name = "Bruce Lee";7Child.age = "30";8Child.lev =Lev;9     returnChild ;Ten          One }; A varx=Parent (); - alert (x.name); -Alert (X.lev ());

Description

1. Defining an object in a function and defining various properties of the object, although the property can be a method, is recommended to define a property as a method's property outside of the function, which avoids the need to create the method repeatedly.
2. When referencing this object, it uses var x = Parent () instead of var x = new Object (); Because the latter may have many problems (the former also becomes a factory classic, the latter is called a hybrid factory approach), it is not recommended to use this object in the new way.
3. The object is returned at the end of the function.
4. It is not recommended to create objects this way, but you should understand.

2. JS constructor mode

1 varlev=function(){2        return"Hey, ha."; 3 };4 functionParent () {5      This. Name = "Bruce Lee";6      This. Age = "30";7      This. Lev =Lev; 8 };9 varx=Parent ();Ten alert (x.name); OneAlert (X.lev ());

Description

1. Using the constructor to create an object is not necessary to create an object inside a function, rather than a factory approach, using this reference, and the function does not need to explicitly return.
2. As with Factory mode, although the value of a property can be a method, it is still recommended that the method be defined outside the function.
3. Similarly, it is not recommended to create objects this way, but you still need to know.

3. JS prototype mode

1 varlev=function(){2        return"Hey, ha."; 3 };4 functionParent () {5Parent.prototype.name = "Bruce Lee";6Parent.prototype.age = "30";7Parent.prototype.lev =Lev; 8 };9 varx=Parent ();Ten alert (x.name); OneAlert (X.lev ());

Description

1. The attribute is not defined in the function.
2. Attributes are defined using the prototype property.
3. The same amount, it is not recommended to create objects in this way.

4. Construction function + Prototype JS mixed mode (recommended)

1 functionParent () {2      This. Name = "Bruce Lee";3      This. Age = "30"; 4 };5parent.prototype.lev=function(){6 return  This. Name;7 }8 varx=Parent ();9 alert (x.name);TenAlert (X.lev ());

Description

1. This pattern refers to the mix and match use of constructors and prototypes.
2. All of the attributes, not the method definition in the function (the way the constructor is), define all the property values as methods of using prototype outside of the function (prototype mode).
3. It is recommended that you create objects in such a way that it is beneficial.

5. Dynamic prototype mode of constructor + prototype (recommended)

1 functionParent () {2      This. Name = "Bruce Lee";3      This. Age = "30"; 4     if(typeofParent.lev = = "undefined"){5Parent.prototype.lev =function(){6             return  This. Name;7         }8Parent.lev =true;9     }    Ten }; One  A varx=Parent (); -Alert (X.lev ());

Description

1. The dynamic prototyping approach can be understood as a hybrid constructor, a special case of the prototype approach.
2. In this mode, properties are defined directly in the function for the properties of the method, but because

   if (typeof Parent.lev = = "undefined") {          Parent.prototype.lev = function() {return this              . Name;          }          Parent.lev = True } thus guaranteeing that an instance of the object is created, the method of the property is not created repeatedly. 

JS Five design modes