Three ways to implement inheritance in JavaScript

First, the prototype chain inheritance
In the context of prototype chain inheritance, JavaScript is similar to languages like Java, C #, and allows only single-parent classes to inherit. The basic way of prototype inheritance is as follows:

New

The object child's prototype property points to an instance of the parent object, so that the child object instance can access the properties, methods, and so on, defined by the parent object construct through the prototype chain.
Does the construct link the parent object through the prototype chain, or does it mean that the object is inherited? The answer is in the negative. Such as:

Newvarnew Child (); alert (child.constructor); //  alert (child instanceof Child); //

Although child can still be used as an instance of child, the original object construction information for the instance child has been lost. The method to compensate for this defect is as follows:

New=varnew Child (); alert (child.constructor); //  alert (child instanceof Child); //

As shown in the code snippet "Child.prototype.constructor = Child", the prototype of child is constructed by specifying the object in the display, forcing all child object instances to be constructed as child.
second, the use of apply, call method
Because JavaScript's built-in function object's apply, call method changes the context of the "This" in the object construction, so that a particular object instance has properties, methods defined in the object construction.
Using apply, call inheritance is especially common when manipulating DOM objects on HTML pages in real-world development. Such as:

  code as follows:  <div id= " extend   >apply,call inherit </div> <script Language= " javascript  "  > function ext () { this . Onclick=function () {alert (this  .innerhtml)}} ext.apply (document.getElementById (  " extend  "     　　Extend    </script> 

The this context inside the Ext method is represented as a DOM object "<div id=" Extend ">apply,call inherit </div>" through the Ext method defined by apply or call.
It is important to note that when you use apply, call, the code snippet defined by the object construct is executed directly, such as:

The code is as follows: <script language="javascript"> function testexec () {alert ( /c4>" Execute! 　　"); } testexec.call (null); //  testexec.apply (null); //

Iii. inheritance between object instances
The polymorphism of JavaScript objects allows instances to dynamically add properties, methods. This feature creates another way of inheriting in JavaScript--The inheritance between object instances. Such as:

The code is as follows:varperson = {Name:"Nathena", Age:" -"}; varNathena = {sex:"male"}; (function Inlineextends (SO,PO) { for(varIinchPO) {if(So[i])//If so also has this member 　　　　　　　　 Continue; So[i]=Po[i]; 　　}}) (Nathena,person); alert (nathena.name);//back to Nathana

As shown in the preceding code, the parent object Persong defines the common property that "human" has in the inheritance between instances of the object name, age, and child object Nathena defines its own private property "sex". Function Inlineextends is the ability to copy the common properties of the "person" defined in the parent object Nathena for the child object.
One of the most notable statements is "if (so[i)", which ensures that a child object's original member is not overwritten by a member of the same name in the parent object, but violates the principle of inheritance between the parent and child objects in the object: The child object can overwrite, overload the property or method of the parents. A parent object can only hide its properties or methods from a child object.

Three ways to implement inheritance in JavaScript