Home >Web Front-end >JS Tutorial >JavaScript Object-Oriented Programming 3 Prototype Pattern (Part 1)_js Object-Oriented

JavaScript Object-Oriented Programming 3 Prototype Pattern (Part 1)_js Object-Oriented

WBOY
WBOYOriginal
2016-05-16 17:58:01919browse

Every function we create has a prototype property, which is an object that contains properties and methods that can be shared by all instances of a specific type. The advantage of using it is that all object instances can share the properties and methods it contains. That is to say, you don't have to define the object's information in the constructor, but you can add this information directly to the prototype object, as follows As shown, continue to rewrite the examples in the first two blogs:

Copy the code The code is as follows:

function Employee() {
};
Employee.prototype.Name = "Jim";
Employee.prototype.Age = 28;
Employee.prototype.Job = "SoftWare Engineer";
Employee.prototype.SayName = function () {
alert(this.Name);
};
var employee1 = new Employee();
employee1.SayName();//Jim
var emplayee2 = new Employee();
emplayee2.SayName(); //Jim
alert(employee1.SayName = emplayee2.SayName);//true

with The difference with the constructor pattern is that these properties and methods of the new object are shared by all instances.
The above is an introduction to the prototype mode. To understand the working principle of the prototype mode, you need to understand the nature of the prototype in ECMASCRIPT.
Understanding Prototypes
In Javascript, whenever a new function is created, a prototype attribute is created for the function according to a specific set of rules. By default, even if there is a prototype attribute, it will automatically obtain a constructor attribute. This attribute contains a pointer to the function where the prototype attribute is located. Through this constructor, we can continue to add other attributes and methods to the prototype.
After creating a custom constructor, its prototype property will only obtain the constructor property by default, while other methods are inherited from Object. When a constructor is called to create a new instance, the instance will contain a pointer (internal property) that points to the prototype property of the constructor. Note that this connection exists between the instance and the constructor prototype property, not between the instance and the constructor.
In some implementations, internal properties (_proto_properties) are not accessible, but in all implementations you can determine whether this prototype relationship exists between objects through the isPrototypeOf method. Essentially, this method returns true if the object's _proto_ attribute points to isPrototypeOf. As shown below:
Copy code The code is as follows:

alert(Employee.prototype.isPrototypeOf( employee1)); //true
alert(Employee.prototype.isPrototypeOf(employee2));//true

will be executed whenever the code reads a property of an object Search,targets an attribute with a given name. The search begins with the object instance itself. If a property with the given name is found in the instance, then the value of that property is found. If not found, the search continues through the prototype object pointed to by the pointer, looking for a property with the given name in the prototype object. If this property is found in the prototype object, the value of this property is returned. This is the basic principle of sharing the properties and methods saved by the prototype between object instances.
As mentioned earlier, the prototype initially only contains the constructor attribute, and this attribute is also shared, so it can be accessed through the object instance.
Although the value saved in the prototype can be accessed through the object instance, it cannot be overridden through the object instance. The value in the prototype. If we add a property to the instance, and the property has the same name as a property in the instance prototype, the name property created in the instance will shield (.net becomes hidden) that property in the prototype, as follows Display:
Copy code The code is as follows:

function Employee() {
};
Employee.prototype.Name = "Jim";
Employee.prototype.Age = 28;
Employee.prototype.Job = "SoftWare Engineer";
Employee.prototype.SayName = function () {
alert(this.Name);
};
emplayee2.Name = "Sun";
alert(employee1.Name); //Jim
alert(employee2.Name); //Sun

The Jim of employee1.Name comes from the prototype, and the sun of employee2.Name comes from the instance.
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn