Web Front-end study notes, practice (13) JavaScript combination mode and inheritance (the most used mode and your own understanding and use)

Combination Mode and inheritance:

First, we recommend Uncle Tom's understanding of the Javascript series for various JavaScript modes. Address: http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html

I have a deep description of various JavaScript modes. So far, I have seen a complete series. Next, let me explain how to create a simple object by using the combined mode and inheritance in actual use.

 

VaRPerson =NewObject (); person. Name= "Dancing in Taipei"; Person. Age= 23; Person. Job= "Web Front-end development engineer"; Person. Sya=Function() {Alert (This. Job);} person. Sya ();
 

 

The combination mode mainly applies constructor and prototype function to Reasonably organizeCodeStructure. For example, a person has a name, a job, and an action. As a result, these artificial code organization forms are more convenient. Next, I will write my own learning example to describe the combination mode for a person. Before that, we need to learn prototype. When you create another function, you also create a prototypr object and automatically obtain the constructor attribute. In some complex large-scale applicationsProgramTo determine the object type, use the instanceof operator for detection. Usage: person instanceof object.

 VaR Person = Function  (Name, age, job ){  //  /<Summary> person </Summary>       //  /<Param name = "name" type = "string"> name </param>       //  /<Param name = "Age" type = "int"> age </param>       //  /<Param name = "job" type = "string"> Work </param>       //  /<Param name = "say" type = "string"> action: My Work </param>       // /<Returns type = "Return Value Type"/>              This . Name = Name;  This . Age = Age;  This . Job = Job;  //  This points to the current person 'class'  } Person. Prototype = {Constructor: person, say:  Function  () {Alert ( This  . Job );}}  //  Organize methods in the form of objects literally  //  Use functions to organize specific operations          Function  Dell (){  //  The new instance generates the person and passes in the parameter in the person 'class '.              VaR De = New Person ("flying in Taipei", "23", "Web Front-end development engineer" );  //  Call the say method through de De. Say ();}  //  The onload function dell Window. onload = Function  () {Dell ();} 

This mode is the most commonly used and common, and has almost reached the universality.

Since the combination mode is mentioned, the concept of inheritance is required during development, but there is no interface inheritance in JS. Therefore, after the number is counted, only the implementation is inherited, through the prototype chain.

 

 //  First define two classes, nameper class and der class          VaR Nameper = Function  (Name, job ){  This . Name =Name;  This . Job = Job ;}  //  Der class, empty class          VaR Der = Function  (){}  //  Methods In the nameper class Nameper. Prototype. Say = Function  () {Alert (  This  . Job );} //  Function          Function  De (){  //  Using the protype prototype, let the DER class inherit the nameper class Der. Prototype = New Nameper ("Dancing in Taipei", "Web Front-end engineer" );  //  Instantiate der class              VaR Her = New  Der ();  //  Call the inherited say Method Her. Say ();} window. onload = Function  () {De ();} 

The above two methods are the most frequently used methods in actual projects.

When studying the design patterns, I read the Javascript design patterns and Uncle Tom's in-depth understanding of the Javascript series.