The borrowing of JS inheritance constructor inheritance and combinatorial inheritance _javascript techniques

Source: Internet
Author: User
Tags inheritance

Borrow constructor Inheritance

In the process of resolving problems with reference type values in prototypes, developers began using a technique called a borrowing constructor (constructor stealing) (sometimes called a forged object or classic inheritance). The basic idea of this technique is quite simple, that is, calling a superclass constructor inside a subtype constructor.

Basic mode

function supertype () {
 this.colors = ["Red", "Blue", "green"];
}
Function subtype () {
  //Inherits Supertype
 Supertype.call (this);
}

var Instance1 = new subtype ();
Instance1.colors.push ("Black");
alert (instance1.colors); "Red,blue,green,black"
var instance2 = new subtype ();
alert (instance2.colors); "Red,blue,green" 

Basic Ideas

The basic idea of borrowing a constructor is to use call or apply to copy (borrow) the properties and methods specified by this in the parent class to the instance created by the subclass. Because the This object is bound at run time based on the execution environment of a function. In other words, in the global, this equals window, and when a function is called as a method of an object, this equals that object. The call, apply method can be used to invoke a method instead of another object. The call, apply method can change the object context of a function from the initial context to the new object specified by Thisobj.

So, this borrowing constructor is the time of the new object (note that the new operator is different from the direct call, when it is called directly in the form of a function, this points to the creation of Window,new, this points to the instance that was created), and the creation of an instance object. and executes the code inside the subtype, and the subtype inside calls Supertyep with call, which means that the this point is changed to point to the new instance, so the this related property and method inside the supertype is assigned to the new instance. Instead of assigning it to Suptype. The properties and methods of these this are defined by the parent class in all instances.

Advantages

In contrast to the prototype chain, borrowing a constructor has a great advantage in that it is possible to pass parameters to a superclass constructor in a subtype constructor. Because the attribute is bound to the above, the invocation is assigned to the corresponding instance, and the values of each instance do not affect each other.

For example:

function Supertype (name) {
this.name = name;
}
Function subtype () {
//Inherits Supertype, and also passes parameter
supertype.call (this, "Nicholas");
Instance property
This.age =;
var instance = new Subtype ();
alert (instance.name); "Nicholas";
alert (instance.age); 29 

Disadvantage

If you simply borrow a constructor, you will not be able to avoid the problem of the constructor pattern--the method is defined in the constructor, so the function reuse is not possible. Also, the methods defined in the superclass prototype are also invisible to the subtype, resulting in only the constructor pattern for all types. In view of these problems, the technique of borrowing constructors is rarely used alone.

Combined Inheritance

Combinatorial inheritance (combination inheritance), sometimes called pseudo-classical inheritance. is an inheritance pattern that combines the prototype chain and the technology that borrows the constructor into one piece to give play to both.

Basic Ideas

The idea is to implement the inheritance of prototype properties and methods using the prototype chain, and to inherit the instance property by borrowing the constructor. In this way, both functions are reused by defining methods on the prototype, and each instance has its own attribute.

Basic model

function Supertype (name) {
 this.name = name;
 This.colors = ["Red", "Blue", "green"];
}
SuperType.prototype.sayName = function () {
  alert (this.name);
};
Function subtype (name, age) {
//Inheritance Property
 Supertype.call (this, name);
 This.age = age;
}
Inheritance method
Subtype.prototype = new Supertype ();
SubType.prototype.constructor = subtype;
SubType.prototype.sayAge = function () {
alert (this.age);
};
var Instance1 = new Subtype ("Nicholas");
Instance1.colors.push ("Black");
alert (instance1.colors); "Red,blue,green,black"
instance1.sayname ();//"Nicholas";
Instance1.sayage ();
var instance2 = new Subtype ("Greg");
alert (instance2.colors); "Red,blue,green"
instance2.sayname ();//"Greg";
Instance2.sayage (); 27 

Advantages

Combinatorial inheritance avoids the pitfalls of prototype chains and borrowed constructors, and combines their advantages to become the most common inheritance pattern in JavaScript.

Disadvantage

The biggest problem with combinatorial inheritance is that, in any case, the two-time superclass constructor is invoked: one at a time when a subtype prototype is created, and another within a subtype constructor. Although the subtype eventually contains all instance properties of the superclass object, we have to override these properties when calling the subtype constructor.

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.