Issues to be aware of when JavaScript uses a For loop-a summary of _javascript tips

Source: Internet
Author: User

If you want to run the same code over and over again and the values are different each time, it's convenient to use loops.

Most of the time we use a For loop, and the for loop department often loops over an array, which we write most of the time:

Second best loop for
(var i = 0; i < myarray.length i++) {
  //use Myarray[i] do something
}

This code is not a big problem, but each loop gets the length of the array, which lowers your code, especially when myarray is not an array, but a htmlcollection object.

Take a look at the following code:

for (var i = 0, max = myarray.length i < max i++) {
  //using myarray[i] do something
}

This way the code will only get the length of an array, improve the quality of the code;

With the single var form, you can move the variable from the loop, as follows:

function Looper () {
  var i = 0,
    max,
    myarray = [];
  // ...
  for (i = 0, max = Myarray.length i < max; i++) {
   //using myarray[i] do something
  }
}

Summary of JavaScript usage for loop

The discussion of this issue was originally from internal mail, and I just recorded the discussion of the issue.

Some of the project teams found that when they were locating the problem, when using the "for (x in array") notation, X had unexpected values in IE.

Specifically, if you customize the Array.prototype.indexOf method (for example, from a prototype pollution), Perhaps because the older version of IE does not support the Array.indexof method, and developers want to use it, then such a browser may have this problem:

Array.prototype.indexOf = function () {...};
var arr = [1, 2];
for (x in arr) console.log (x);

Will output

1
2
function () {...}

In other words, indexOf This method out of the output.

The workaround is simple, either do not add this method, or use the "for(i=0 i < array.length; i++)" loop, and so on.

But what is the nature of the problem? It is speculated that the use of for (x in obj) is actually going to traverse an object, and the implementation of the array is in fact consistent with the normal object, except that the key is an established value:

{0: "Something", 1: "Something Else"}

It is also mentioned in a StackOverflow question and answer that traversing an array with for...in and for (;;) The difference between the former meaning is the enumeration object's properties, there are two problems:

The order of the enumeration cannot be guaranteed;

Inherited properties are also enumerated;

With support for Array.prototype.forEach , it is also clear from this table that IE8 and the following versions are not supported accurately:

There is also a detailed description of the Foreach method compatibility. In fact, the main JavaScript frameworks (such as jquery, underscore, and prototype, and so on) have secure and common For-each functionality implementations.

It is also mentioned in the JSLint for in section that the for in statement allows looping through the object's property names, but also traverses the attributes inherited through the prototype chain, which in many cases can cause unexpected errors. There is a rough solution:

For (name in object)

 {if (Object.hasownproperty (name))

 {...}}}

There are also references to the problem of using a for (var i=0;i<length;i++) loop like this, because JavaScript does not have code block-level variables, so the access rights of I here are actually the method. Some books suggest that programmers put such variable statements in one place, but intuitively, in most cases, they are not reasonable.

Using the "let" introduced in JavaScript 1.7 solves this problem by making I a real block-level variable of code:

For (let I =0; i < a.length; i++)

Finally, in Google's JavaScript style guide, this constraint is also involved:

For-in Loop: Iterating over the keys in a


Object/map/hash

The above is this article about JavaScript use for loop when the attention of the problem---------the whole content of the problem summary, hope to be helpful to work study in the future, and welcome everyone in the industry to make critical suggestions.

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.