A summary of common traps in JavaScript _javascript skills

Source: Internet
Author: User
Tags function definition hasownproperty
All the functions you create are case-sensitive.
Single quotes (' Strings ') and double quotes ("strings") have no special distinction in JavaScript, and can be used to create strings. But as a general rule, most Web developers choose to use single quotes instead of double quotes, Because the XHTML specification requires that all XHTML attribute values must be enclosed in double quotes.

JavaScript does not support overloading, in JavaScript, the script does not take into account the parameters of the function definition when executing, but rather uses the function that is last defined in the scope chain. This means that a function with the same name always has only one instance


A closure is a scope-related concept that refers to an intrinsic function that can still access the properties of its external function even after the external function completes and terminates. When referring to a variable or method, JavaScript follows the path of the object execution by using a domain chain to parse the domain to find the value that the variable has recently defined, which is used once found. function Initanchors (event) {
Copy Code code as follows:

for (Var i=1 i <=3; i++) {
var anchor = document. getElementById (' anchor ' + i);
Anchor.attachevent (' onclick ', function () {
Alert (' My ID is anchor ' + i);
});
}
}

Suppose there are three a elements in the page, the IDs are anchor1 to Anchor3, the program registers the onclick event for three a elements, and click the first a element to display "My ID is Anchorx", but the actual operation is not the case, and clicking each a element displays "my ID is Anchor4 ". Why is this, because the value of I is actually obtained from the use of a domain chain when a Click event occurs, and when the Click event occurs, Initanchors () is executed, at which point the value of I is equal to 4. The solution can be as follows
Copy Code code as follows:

function Registeranchorlistner (anchor,i) {
Anchor.attachevent (' onclick ', function () {
Alert (' My ID is anchor ' + i);
}
}
function Initanchors (event) {
for (Var i=1 i <=3; i++) {
var anchor = document. getElementById (' anchor ' + i);
Registeranchorlistner (Anchor,i);

}

}

var anchor = document. getElementById (' anchor ' + i);
Anchor.attachevent (' onclick ', function () {
Alert (' My ID is anchor ' + i);



});



Iteration objects, which are often used when writing scripts, as follows:
Copy Code code as follows:

var list = [1,2,3,4];
for (var i = 0;i < List.length; i++) {
alert (list);
}

Another alternative iteration method is to use a for loop to traverse each property in the (in) list:
Copy Code code as follows:

for (var i in list) {
alert (list);
}

At this point, you get the same result as using the previous iteration method, because the list is an array object.

However, it is important to be careful when using the for (var i in Item) method to manipulate objects that resemble arrays rather than arrays, as follows
Copy Code code as follows:

var all=document.getelementsbytagname (' * ');
for (var i, all) {
Perform certain actions against the all element
}

During this iteration, the value of I equals length, item, and Nameditem, which is likely to cause unexpected errors in the code. In some cases, you can use the object's hasOwnProperty () method to avoid this problem. The hasOwnProperty () method returns True if the object's properties or methods are not inheritable. That is, the check here does not involve properties and methods inherited from other objects, only properties that are created directly in the specific object itself, such as elements assigned to the array. Therefore, if you use this check in the For loop, the loop will skip length so that the length is not the true attribute of array all, but rather a property inherited from the Namenodemap object of the derived array all
Copy Code code as follows:

var all=document.getelementsbytagname (' * ');
for (var i, all) {
if (!all.hasownproperty (i)) continue;
Perform certain actions against the all element
}
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.