JavaScript prototype increment trap

Source: Internet
Author: User
If you do not increment attributes in the prototype by using the constructor. prototype of the object, the prototype increment trap is triggered. This article uses a Popup pop-up box to explain the occurrence of traps, and describes how to locate traps and solve problems. In addition, this article assumes that you have at least a brief understanding of the original... SyntaxHighlighter. all in JavaScript. If you do not use the constructor. prototype of the object to increment attributes in the prototype, the prototype increment trap is triggered. This article uses a Popup pop-up box to explain the occurrence of traps, and describes how to locate traps and solve problems. In addition, this article assumes that you have at least a brief understanding of the prototype in JavaScript. Directory: record the number of alert pop-up box single instance call code explanation pop-up content add an instance code explanation pop-up content debug split bug skip trap summary read: javaScript-constructor record the number of alert pop-up window. A single instance calls var Popup = function () {} Popup. prototype. alert = function (message) {this. iMessageCount ++; alert (message + '~ Alert '+ this. iMessageCount +' ');} Popup. prototype. iMessageCount = 0; var oNimo = new Popup (); oNimo. alert ('Hello, I am nimo! '); // Alert once oNimo. alert ('nice to meet you, I am Nimo! '); // The alert Code has been interpreted twice to create the constructor Popup and add the alert Method to the Popup. The pop-up content is the number of pop-up messages. The increment iMessageCount attribute is displayed each time. Add the public attribute iMessageCount to record the number of pop-up times. Create an oNimo instance and use oNimo to pop up twice. Hello, I am nimo !~ Alert once Nice to meet you, I am Nimo !~ Alert appears to be normal after two times. The pop-up content is the same as the expected result. Add an instance and add the following code var oDemo = new Popup () at the bottom of the above Code; oDemo. alert ('I am a demo! '); // Alert once explained the code to create an oDemo instance and then popped up twice with oDemo. The pop-up content is demo !~ The oDemo pop-up result of alert once should be three times, but the result is that alert once debug encountered a bug and the relevant object is output to check the console. log (oNimo); // Popup {iMessageCount: 2, alert: function, iMessageCount: 0} console. log (oDemo); // Popup {iMessageCount: 1, alert: function, iMessageCount: 0} after printing the result, it is found that the iMessageCount attribute in the prototype is not increasing, and it is still 0. While the attributes of oNimo and oDemo store the iMessageCount attributes, which are 2 and 1 respectively. This. iMessageCount ++; increments the attributes of the object rather than the prototype attributes. Since the problem lies in this. iMessageCount ++, this line of code is analyzed in detail. The following three lines of code are actually equal to this. iMessageCount ++ this. iMessageCount = this. iMessageCount + 1this. iMessageCount = this. constructor. prototype. iMessageCount + 1 The increment operation iMessageCount attribute is equal to the iMessageCount attribute. + 1 because the object itself does not have the iMessageCount attribute, the iMessageCount Attribute + 1 in the prototype attribute is assigned to the iMessageCount attribute in the object attributes. Knowledge point: when an object accesses a property, it first finds its own property. If it cannot find its own property, it searches for the property in prototype in the constructor of the object (the property in the prototype of the object constructor ). Skip the trap. to increment attributes in the prototype, directly increment attributes in protorype of the constructor. Fixed code: key code: this. constructor. prototype. iMessageCount ++; complete code: var Popup = function () {} Popup. prototype. alert = function (message) {this. constructor. prototype. iMessageCount ++; alert (message + '~ Alert '+ this. iMessageCount +' ');} Popup. prototype. iMessageCount = 0; var oNimo = new Popup (); oNimo. alert ('Hello, I am nimo! '); // Alert once oNimo. alert ('nice to meet you, I am Nimo! '); // Alert twice var oDemo = new Popup (); oDemo. alert (' I am a demo! '); // The prototype increment trap is triggered when the object constructor. prototype is not used to increment attributes in the prototype three times. To increment attributes in the prototype, directly increment the attributes in protorype In the constructor of the object.

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.