JS prototype and construction method content is copied from elsewhere

Source: Internet
Author: User

In JavaScript, a method is inherently 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 a pointer to the prototype stored in each instance, stored in the prototype.

All modifications to the prototype method affect all instances, and the constructor method is actually accessed and modified only by the instance, and only affects the corresponding instance.

Write a conclusion: A method should usually be defined using a prototype schema, and dynamically redefined by a prototype when necessary, avoiding the use of a construction pattern to define a method.

Take a look at the sample code: We first construct a simple class car, which defines 2 methods, namely the constructfunction defined by the construction method and the prototypefunction defined by the prototype mode.

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

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

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

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

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

Output Result:

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 class's prototype, 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 is:

This a new prototypefunction
This a new prototypefunction

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

The construction method cannot be accessed through the prototype, but only through instance access, and can only be redefined by instance. The following code attempts to modify the instance: Acar method constructfunction

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

Car.constructfunction () attempts to construct a defined method through a class or a class's prototype access is invalid and will error
Car.prototype. Constructfunction () attempts to construct a defined method through a class or a class's prototype access is invalid and will error

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

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

Output Result:

This a new constructfunction
This is constructfunction
This is constructfunction

The method of constructing the instance Acar and affecting the acar without affecting the other instances

In fact, the prototype method can be directly modified by the instance, if you directly modify the prototype method of the instance what will happen?

at the beginning of this paragraph, it has been pointed out that "the original method stored in each instance is actually a pointer to the prototype", if you try to modify the prototype method of the instance, 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 is turned, this prototype method of the example is separated from the definition of the prototype and becomes an independent method. This process can be clearly understood by the following code:

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

Modify the Acar prototype method prototypefunction
Acar.prototypefunction = function () {
Echo (' This a new prototypefunction ');
}
Check the result of the modification
Acar.prototypefunction ();
Bcar.prototypefunction ();
Ccar.prototypefunction ();

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


Output Result:

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

Note: Although it is possible to modify the prototype of an instance directly, it can lead to confusion and confusion in the code and avoid it as much as possible.

JS prototype and construction method content is copied from elsewhere

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.