JavaScript class-The difference between the construction method and the prototype method __java

Source: Internet
Author: User

http://www.link888.cn/index.php?load=read&id=500

For JavaScript, the method is essentially a property.

The construction method , like the construction property, is stored separately in each instance and is completely independent of each other.

The prototype method , like the prototype property, is stored in the prototype, and the actual previous pointer to the prototype is stored in each instance.

All modifications to the prototype method affect all instances, and the construction method can actually only be accessed and modified through an instance, and will only affect the corresponding instance.

First write the conclusion: methods should usually be defined using the stereotype pattern, and dynamically redefine it through the prototype if necessary, avoiding the use of the construction pattern to define the method.

Take a look at the sample code: We first construct a simple class car, and define 2 methods, respectively, of the constructfunction defined by the constructed method and the prototypefunction of the prototype method.

function echo (str) {document.write (' <div> ' +str+ ' <div> ');}

function car () {
This.constructfunction = function () {
Echo (' is constructfunction ');
};
}

Car.prototype.prototypeFunction = function () {
Echo (' is prototypefunction ');
};

ACar = new car ();
Bcar = new car ();

Acar.constructfunction ();
Acar.prototypefunction ();
Bcar.constructfunction ();
Bcar.prototypefunction ();

Output results:

This is constructfunction
This is prototypefunction
This is constructfunction
This is prototypefunction

The prototype method can be dynamically defined and modified at any time , and the modified method is, of course, accessed through the prototype of the class, which can affect all instances of the class by redefining the prototype method:

ACar = new car ();
Bcar = new car ();

Car.prototype.prototypeFunction = function () {
Echo (' This a new prototypefunction ');
};

Acar.prototypefunction ();
Bcar.prototypefunction ();

The output results are:

This a new prototypefunction
This a new prototypefunction

As you can see, even after the instance has been created, modifications to the stereotype can be reflected to all instances.

construction methods cannot be accessed through prototypes, only through instance access, but also through instances. The following code attempts to modify the instance: The method of Constructfunction

ACar = new car ();
Bcar = new car ();
Ccar = new car ();

Car.constructfunction () a method that attempts to access a constructed definition through a class or a class's prototype is invalid and can cause an error
Car.prototype.. Constructfunction () a method that attempts to access a constructed definition through a class or a class's prototype is invalid and can cause an error

Acar.constructfunction = function () {
Echo (' This a new constructfunction ');
}

Acar.constructfunction ();
Bcar.constructfunction ();
Ccar.constructfunction ();

Output results:

This a new constructfunction
This is constructfunction
This is constructfunction

The construction method of the instance Acar and the influence to the Acar did not affect other instances

in fact, the prototype method can also be directly modified by an instance, what happens if the prototype method of the instance is directly modified.

As noted at the beginning of this paragraph: "The actual previous pointer to the prototype stored in the prototype method in each instance", if you try to modify the instance's prototype method, change the pointer to point to the newly defined method function, and the method definition in the prototype is not affected. At the same time, since the pointer turns, the prototype method of the instance is separated from the definition of the prototype and becomes an independent method. This process can be clearly understood through the following code:

ACar = new car ();
Bcar = new car ();
Ccar = new car ();

Modifying the prototype method of the Acar prototypefunction
Acar.prototypefunction = function () {
Echo (' This a new prototypefunction ');
}
Check the results of the changes
Acar.prototypefunction ();
Bcar.prototypefunction ();
Ccar.prototypefunction ();

Modify the prototype method Prototypefunction, you will find the secret of the place
Car.prototype.prototypeFunction = function () {
Echo (' This a new prototypefunction modified by prototype ');
}
Check the results of the changes
Acar.prototypefunction ();
Bcar.prototypefunction ();
Ccar.prototypefunction ();


Output results:

The output of the first paragraph
This is the new prototypefunction///Prototypefunction when modifying the prototype method of the Acar, only the Acar is affected
This is prototypefunction
This is prototypefunction
The output of the second paragraph
We have redefined the car's prototype method Prototypefunction, but the Acar is not affected, and the method of prototypefunction has been disconnected from the prototype.
This a new prototypefunction
This is a new prototypefunction modified by prototype
This is a new prototypefunction modified by prototype

Note: The prototype method of directly modifying the instance is feasible, but it can lead to confusion and confusion on the code, and avoid using this method as much as possible.

Related Article

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.