JavaScript Object-Oriented inheritance method classical implementation _ Basic knowledge

The advent of JavaScript has been nearly more than 20 years, but the praise of this prediction is still divergent. Many people say that JavaScript is not an object-oriented language. But the type of JavaScript is very loose and there is no compiler. This gives programmers a lot of freedom, but it also brings some flaws.

Although JavaScript is not an object-oriented language. But we can implement object-oriented programming in JavaScript by imitating other languages.

The following are very classic inheritance methods in the JavaScript tutorial.

Copy Code code as follows:

Defines a pet object. Through this one name and number of legs.
var Pet = function (Name,legs) {
THIS.name = name; Save ths name and legs values.
This.legs = legs;
};

Create a method that shows the pet's name and number of legs.
Pet.prototype.getDetails = function () {
Return this.name + "has" + this.legs + "legs";
}

Defines a cat object that inherits from pet.
var Cat = function (name) {
Pet.call (this,name,4); Call the constructor of this parent object
};

This line performs inheritance from pet.
Cat.prototype = new Pet ();

A cat that adds an action method
Cat.prototype.action = function () {
Return "Catch a bird";
};

Create an instance of the Petcat cat.
var petcat = new Cat ("Felix");

var details = petcat.getdetails ();
Console.log (Details)//"Felix has 4 legs".
var action = petcat.action ();
Console.log (Action)//"Catch a Bird".
Petcat.name = "Sylvester"; Change the name of Petcat
Petcat.legs = 7; Change the number of petcat legs
Details = Petcat.getdetails ();
Console.log (Details)//"Sylvester has 7 legs".

Although the above method does not have much problem to execute, but the overall code style is slightly bloated, not very elegant. You can also modify the properties outside. This method does not protect inherited properties. The following method, omitting new and prototype, is implemented using the attribute of "function inheritance".

Copy Code code as follows:

Defines a pet object. Through this one name and number of legs.
var pet = function (Name,legs) {
Create an object that, where the name can be changed, but the number of legs can not be changed to achieve the privatization of variables.
var that = {
Name:name,
Getdetails:function () {
Return that.name + "has" + legs + "legs";
}
};

return to that;
}

Defines a cat object that inherits from pet.
var cat = function (name) {
var that = pet (name,4); Inheriting properties from pet

A method of adding an action to the cat.
That.action = function () {
Return "Catch a bird";
}

return to that;

}

Create a petCat2;
var petCat2 = Cat ("Felix");

var details = petcat2.getdetails ();
Console.log (Details)//"Felix has 4 legs".
var action = petcat2.action ();
Console.log (Action)//"Catch a Bird".
Petcat2.name = "Sylvester"; We can change the name.
Petcat2.legs = 7; But you can't change the number of legs.
Details = Petcat2.getdetails ();
Console.log (Details)//"Sylvester has 4 legs".

Hint: The advantage of using a prototype inheritance is the high memory efficiency, regardless of how many times it is inherited, the object's prototype properties and methods are only saved once. When a function inherits, each new instance creates duplicate properties and methods. If you create many large objects, memory consumption can be very large. The workaround is to save the larger property or method in an object and pass it as a parameter to the constructor. Instead of creating your own version, all instances will use an object resource.

The above two methods can easily implement JavaScript object-oriented inheritance, there is no absolute good method, and there is no absolute bad method. Depending on your personal circumstances and preferences. These two methods are not unique, you are welcome to comment and add yo!~