JS Inheritance Implementation method detailed _javascript skills

This article describes the JS inheritance implementation method. Share to everyone for your reference, specific as follows:

var animal=function (name) {//constructor
  This.name=name;
  This.sayhello=function () {
  alert ("Hi i Am" +this.name);
  }
Animal.prototype.shout=function () {//prototype main function: Add a new property or function to the class
  alert (this.name+ "is barking!) ");
};
Animal.prototype.game=function () {
  alert (this.name+) is playing! ");
};
var dog=new animal ("small Black");  Instantiation of
Dog.sayhello ();
Dog.shout ();
Dog.game ();

First, prototype inheritance

var animal=function (name) {
  this.name=name;
  This.sayhello=function () {
  alert ("Hi i Am" +this.name);
  }
Animal.prototype.shout=function () {
  alert (this.name+) is barking! ");
};
Animal.prototype.game=function () {
  alert (this.name+) is playing! ");
};
var dog=function (name) {
  this.name=name;
  This.shout=function () {   //overriding the function of the parent class
  alert (this.name+) "Bark!" ");
  }
}
Dog.prototype=cat.prototype=new animal ();
var dog=new dog ("small black");
Dog.sayhello ();
Dog.shout ();
Dog.game ();
var cat=new cat ("small white");
Cat.sayhello ();
Cat.shout ();
Cat.game ();

Animal is the parent class (or superclass), who is the parent (superclass).

Improvement: Write a function specifically to implement inheritance

var animal=function (name) {
  this.name=name;
  This.sayhello=function () {
  alert ("Hi i Am" +this.name);
  }
Function.prototype.extends=function (superclass) {      //extends is a reserved keyword that cannot be taken out alone, such as Var extends=function () {}, And here it can be used because he is added to the properties of the function
  this.prototype=new superclass ();
Animal.prototype.shout=function () {
  alert (this.name+) is barking! ");
};
Animal.prototype.game=function () {
  alert (this.name+) is playing! ");
};
var dog=function (name) {
  this.name=name;
  This.shout=function () {
  alert (this.name+ "Barking!) ");
  }
}
Dog.extends (animal);
var dog=new dog ("small black");
Dog.sayhello ();
Dog.shout ();
Dog.game ();
var dog=new Dog ("small white");
Dog.sayhello ();
Dog.shout ();
Dog.game ();

Second, call,apply inheritance (incomplete inheritance)

var animal=function (name) {
  this.name=name;
  This.sayhello=function () {
  alert ("Hi i Am" +this.name);
  }
Animal.prototype.shout=function () {
  alert (this.name+) is barking! ");
};
Animal.prototype.game=function () {
  alert (this.name+) is playing! ");
};
var dog=function (name) {
  animal.call (this,name);
}
var dog=new dog ("small black");
Dog.sayhello ();
Dog.shout ();
Dog.game ();

Output: Hi, I'm little black.

TypeError:dog.shout is not a function

By means of call (apply), you can only change its this point, which is added through prototype, and he cannot inherit directly.

Summary: call,apply This way of inheriting applies to classes that do not have prototype or that do not need to inherit prototype added properties or functions, because the call and apply functions only implement the substitution of methods without copying the properties and functions of the object

Prototype inheritance, you can inherit all of the properties and functions

Inherited properties, only the original property is deleted before the inherited property is exported

For more on JavaScript related content to view the site topics: "JavaScript object-oriented Tutorial", "javascript json operation tips Summary", "JavaScript switching effects and techniques summary", " JavaScript Search Algorithm Skills summary, javascript error and debugging skills Summary, JavaScript data structure and algorithm skills summary, JavaScript traversal algorithm and skills summary and JavaScript mathematical Operational Usage Summary

I hope this article will help you with JavaScript programming.