Javascript for loop without recalculating array's length

Question

In my Javascript reference book, for loops are optimized in the following way:

for( var i = 0, len = keys.length; i < len; i + +) { BODY }

Apparently, doing "len = keys.length" prevents the computer from recalculating keys.length each time it goes through the for loop.

I don't understand why the book doesn't write "var len = keys.length" instead of "len = keys.length"? Isn't the book making "len" a global variable, which isn't good if you're trying to nest two for-loops that loop through two arrays?

E.g.

for( var i = 0, len = keys.length; i < len; i + +) { 
     for (var i = 0; len = array2.length; i < len; i++) {
     }
}

Source: Flanagan, David (2011-04-18). JavaScript: The Definitive Guide: Activate Your Web Pages (Definitive Guides) (Kindle Locations 6992-6998). O'Reilly Media. Kindle Edition.

var i = 0, len = keys.length is shorthand for var i=0; and var len=key.length — bugwheels94
– bugwheels94, Commented May 23, 2015 at 5:30

score 2 · Accepted Answer · 2015-05-23 05:52:56Z

2

You can chain variable declarations like this

var i = 0, foo="bar", hello = "world"

Which is close to the same thing as

var i = 0;
var foo = "bar";
var hello = "world";

So this

for(var i = 0, len = keys.length; i < len; i++)

Is the same as

var len = keys.length;
for(var i = 0; i < len; i++)

I like to avoid .length altogether and use something like

var keys = /* array or nodelist */, key, i;
for(i = 0; key = keys[i]; i++)

This will cause the for loop to end as soon as key resolves to undefined. Now you can use key instead of keys[i]

As a side note, your second example would never work as all of the variables defined in the first for statement would be overwritten by the second, yielding unexpected results. You can nest for loops, but you have to use different variable names.

edited May 23, 2015 at 5:52

answered May 23, 2015 at 5:46

user4639281

Sign up to request clarification or add additional context in comments.

1 Comment

Michael Geary Over a year ago

I used to use and promote a loop style very similar to your last example. However, I don't use it any more. Surprisingly, it is much slower than a conventional loop in modern browsers, because reading past the end of the array causes the entire array to become de-optimized. Here are some test results for various kinds of loops.

user1707873 · Accepted Answer · 2015-05-23 05:48:27Z

1

AS Ankit correctly mentioned in the comments of the question, it is a shorthand. And moreover, if I am correct, javascript is functionally scoped and not block scoped, so you are overwriting the len declared in the outer for loop while re-declaring it in the inner one.

answered May 23, 2015 at 5:48

user1707873

1,3472 gold badges10 silver badges10 bronze badges

Comments

Guilherme David da Costa · Accepted Answer · 2018-04-06 16:48:05Z

0

In Javascript each time you instantiate it's a heavy cost. Using one var and short hand commas to create multiple variables is much more efficient.

Your example using only one var to create a variable.

 for (var i = 0, len = array2.length; i < len; i++) {
      //loop
 }

The alternative is to var up the len variable outside the loop.

 var len = array2.length; 
 for (var i = 0; i < len; i++) {
      //loop
 }

Now you have two separate "var" instances.

I personally like to declare my var at the beginning.

 var len = array2.length,
     i = 0;

 for(i = 0; i < len; i++){
      //First loop
 }

 //So if I use more than one for loop in a routine I can just reuse i
 for(i = 0; i < 10; i++){
      //Second loop
 }

Hope that helps explain.

edited Apr 6, 2018 at 16:48

Guilherme David da Costa

2,3784 gold badges32 silver badges47 bronze badges

answered May 23, 2015 at 5:46

Proximo

6,61111 gold badges54 silver badges68 bronze badges

1 Comment

Michael Geary Over a year ago

Whether you use one var or two won't affect performance in the slightest. It's really a matter of which style you prefer. (Also note a typo in your first example.)

Collectives™ on Stack Overflow

Javascript for loop without recalculating array's length

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related