The prototype and inheritance in JS

Source: Internet
Author: User

Prototype:

JS all functions have a prototype attribute, which refers to an object, the prototype object, or the prototype. This function includes constructors and normal functions, and we are talking more about the prototype of the constructor, but we cannot deny that the common function also has a prototype. For example, the normal function:

function F () {
;
}
Alert (f.prototype instanceof Object)//true

The process by which the constructor instantiates the object.
function A (x) {this.x=x;} var obj=new A (1);

There are three steps to instantiating an obj object:

    • 1. Create obj object:var obj=new A (1);
    • 2. Point the internal __proto__ of obj to the prototype that constructs his function A.  The constructor property of the instance object of the class always points to the prototype.constructor of the constructor. obj does not have a prototype attribute, but has an internal __proto__ that obtains prototype properties and prototype methods on the prototype chain through __PROTO__
    • 3. Use obj as this to invoke constructor A to set the members (that is, object properties and Object methods) and initialize them. (obj as this, so obj.x = x)

2 ways to define the prototype method:
function A (x) {this.x=x;    This.say = function () {alert (' Hi ')}  ;}

Another type of:

A.prototype.say=function () {alert ("Hi")};

Difference:

The former, each object has a copy of the Say method.

The latter, the say method of this prototype object is the only copy for everyone to share. (This is achieved through an internal _proto_ chain.) )

Class inheritance

A simple inheritance implementation. (JS has no class, this is just a constructor)

function A (x) {this.x=x;}  function B (x2,y) {this.tmpobj=a;  This.tmpobj (x2);  Delete this.tmpobj; This.y=y;}

5, 6, 7 lines: (Temporary role)

Create a temporary property Tmpobj reference constructor A, then execute inside B and delete after execution.

B Of course you have the X attribute:

function A (x) {this.x=x;}  function B (x2,y) {this.x=x2; This.y=y;}

  

Of course, the x attribute of B and the X attribute of a are independent, so they are not strictly inherited.

The 5th, 6, and 7 lines have a simpler implementation:

A.call (THIS,X);

  

Here's the problem.

b Although it inherits all the property methods of a constructed object, it cannot inherit the members of A's prototype object.

function A (x) {this.x=x;}  A.prototype.a = "a"; function B (x2,y) {A.call (this, x); This.y=y;}

This looks like B inside is not inheriting a.prototype.a = "A"; property of the!

Prototype inheritance

Solve the above problem:

function A (x) {this.x = x;} A.prototype.a = "a";   function B (x2,y) {this.y = y; A.call (THIS,X2); }B.PROTOTYPE.B1 = function () {alert ("B1");} B.prototype = new A ();  Note that there are no parameters in a! B First by "Class inheritance" once, and by "prototype inheritance" once//so B has two x properties, one for "a", a undefined! At this point, "prototype attribute X" is to be in "instance object property X", or "a". Also note: At this point, B.prototype.constructor is the construction of object A! When alert (B.prototype.constructor) comes out, it is "function A (x) {...}"  The following has resolved the//Set up a prototype method B1, but the above line, the prototype point to change, the original B1 prototype object was discarded, naturally did not B1//and then a b2 b.prototype.b2 = function () {alert ("B2");} B.prototype.constructor = b;//The constructor of the B prototype is re-directed to the B constructor//instantiation B a var obj = new B (1,3);

Class inheritance is this line: A.call (this.x);

The prototype inheritance is this line: B.prototype = new A ();

If not

B.prototype.constructor = B;

is that not obj = new B (1,3) going to call the A constructor instantiation?

The answer is in the negative:

You will find obj.y=3, so the B constructor that is called is still instantiated.

It's just that

Obj.constructor===a  //true

For the behavior of New B (), the above mentioned 3 steps for creating an instance object from a constructor are performed:

    • The first step is to create an empty object;
    • The second step, obj.__proto__ = = = B.prototype; (B.prototype is a member of the X,A,B2.) Then obj.constructor points to B.prototype.constructor, which is the constructor A;)
    • The third step is to call the constructor B to set and initialize the member with the property x, Y.

Original source: http://ljchow.cnblogs.com

The prototype and inheritance in JS

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.