Chapter V web front-end development engineer --JavaScript Advanced Programming 5-7 JavaScript prototype

                                                                                      Prototype JavaScript

 

This lesson is to talk:

  1. JavaScript prototype property
  2. JavaScript __proto__

                                                                                      Speaker teachers: Head teacher

A. JavaScript object created

Each has a function that we create the prototype (prototype) property, which is an object, whose purpose is to properties and methods can be shared by all instances of a particular type comprising. The logic can be understood: the prototype object of that object prototype created by calling the constructor. The benefits of using the prototype can make all object properties and methods it contains examples of sharing. In other words, you do not have to define the object information in the constructor, but this information can be added directly to the prototype.

Box function () {} // declare a constructor

 

= Box.prototype.name 'Lee'; // add attributes in the prototype

Box.prototype.age = 100;

= Function Box.prototype.run () { // add method in the prototype

return this.name + this.age + 'operation ...';

};

 

Compare method address in the prototype are the same:

was box1 = new Box ();

was box2 = new Box ();

Alert (box1.run == box2.run); // to true, the method of keeping the reference address

 

 

To further understand declarative and declarative constructor prototype model, by way of illustration we take a look:

Constructors way

 

Prototype model way

 

In the prototype model statement, more than two properties, these two attributes are automatically generated when you create the object. __proto__ property is an example of a pointer pointing to the prototype object, its role is directed prototype property constructor constructor. With these two properties, you can access the properties and methods in the prototype of the.

二. JavaScript __proto__

PS: IE browser will not recognize the script access __proto__, Firefox and Google Chrome and other browsers can identify certain. Although output, but you can not get inside information.

alert(box1.__proto__); //[object Object]

 

Determining whether a pointing object is the prototype object constructor may be used isPrototypeOf () method to test.

Alert (Box.prototype.isPrototypeOf (Box)); // Whenever an instance of the object, i.e., will point

 

Prototype model of the implementation process:

  1. Find function in the first instance constructed properties or methods, if any, return immediately;
  2. If there are no instance constructor function, its prototype object is to find where, if there is, it returns;

 

Although we can access the value stored in the prototype through an object instance, but it can not be accessed by rewriting the value of the prototype object instance.

was box1 = new Box ();

Alert (box1.name); // Lee, where the value of the prototype

box1.name = 'Jack';

Alert (box.1name); // Jack, the principle of proximity,

 

was box2 = new Box ();

Alert (box2.name); Lee, // the value in the prototype, have not been modified box1

 

If you want box1 can continue to access the value of the prototype in the back, you can put the constructor attributes can be deleted, as follows:

box1.name the Delete; // delete the property

alert(box1.name);

 

How to determine the property is in an instance constructor's still in the prototype? You may be used hasOwnProperty () function to verify:

Alert (box.hasOwnProperty ( 'name')); // example there returns true, false otherwise

 

Examples constructors and properties of prototype properties schematic

 

 

It returns true when it can be accessed through the object in the given attribute operator, regardless of whether the property is present in the prototype example.

Alert ( 'name' in Box); // to true, the presence or prototypes example

 

() Allows us to detect the existence of the property instance by hasOwnProperty, to determine whether there may be attributes or instance by prototype in. Then combining these two methods, presence attributes can determine whether the prototype.

isProperty function (Object, Property) { // determines whether there are properties of the prototype

return !object.hasOwnProperty(property) && (property in object);

}

 

each box = new Box ();

Alert (isProperty (Box, 'name')) // to true, if there is the prototype

 

In order for the properties and methods to better reflect the effect of the package, and reduce unnecessary input, can be used to create a prototype literal manner:

function Box() {};

= {Box.prototype // use literal manner

name : 'Lee',

age : 100,

run : function () {

return this.name + this.age + 'operation ...';

}

};

 

Create an object prototype model also has its own shortcomings, it omits the constructor parameter passing initialization process, bring the disadvantage is initialized value are the same. The biggest drawback is the prototype of its greatest strengths, and that is shared.

 

Guess you like

Origin blog.csdn.net/wgf5845201314/article/details/92381749