Javascript for loop without recalculating array's length - javascript

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.

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.

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.

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.

Related

For loop lasts infinitely javascript

I have a problem in my code:
var row = ["1","2","3","4","5"];
var column = ["1","2","3","4","5"];
var arrayLength = row.length;
var arrayLength2 = column.length;
for (var i = 0; i < arrayLength; i++) {
for (var e = 0; e < arrayLength2; e++) {
var samples = document.querySelectorAll('[data-row-id="'+row[i]+'"][data-column-id="'+column[e]+'"]');
for(var i = 0; i < samples.length; i++) {
var sample = samples[i];
sample.setAttribute('data-sample-id', row);
console.log("Colore cambiato");
}
}
}
When i run it, the cycle lasts infinitely and the console.log is called up a lots of times
Where is the error? Thanks!
The problem is that your inner-most loop uses the same i looping variable as your outer most loop and it's constantly changing i so that the outer loop never finishes.
Change the variable on your inner loop to a different identifier that you aren't already using in the same scope.
Youre using same loop i twice nested so it runs infinitely coz it always resets i in inner loop
use something else instead like k
for(var k = 0; k < samples.length; k++) {
var sample = samples[k];
sample.setAttribute('data-sample-id', row);
console.log("Colore cambiato");
}

Buggy Javascript Function Complains Missing For Loop ")"

The following is my simple function to create a range array between two numbers. The problem is that console keeps complaining that for loop has a missing bracket ")" but I can plainly see that it is not missing. Please help!
function range(start, end){
var len = end - start;
for (var i = 0; i <= len; i++){
var arr[i] = x + i;
}
return arr[];
}
console.log(range(1, 10));
console.log(arr.length);
Here is the output:
SyntaxError: missing ) after for-loop control (line 3)
Edit
for (var i = 0; i <= len; i++){
was
for (var i = 0; i <= len; i++;){
remove
↓
for (var i = 0; i <= len; i++;)
Remove the final semicolon:
for (var i = 0; i <= len; i++)
Your code has other issues, but this answers the question asked. I suggest you pull out a guide on JavaScript and correct your syntax throughout your code.
There were three errors. I cannot fix undeclared 'x', which is either in outter scope (global) or this is an error that you have to fix with your own logic.
function range(start, end){
var arr = []; //declare your array
var len = end - start;
for (var i = 0; i <= len; i++){
arr[i] = x + i; //here x is undeclared, single array indices cannot be declared this way
}
return arr;
}
console.log(range(1, 10));
console.log(arr.length);
You shouldn't put a semi-colon (;) after the last statment in the for loop. Remove it.
It's very unlikely that something like a for loop is buggy in JavaScript, in a language that is usef by millions every day.

Why wont my loop within a loop in Javascript work?

This is suppose to store the chosen answer for multiple questions. When I use this code, it only checks the first question and disregards the other questions.
for(i = 0; i < questions.length-1; i++){
radios = document.getElementsByName(questions[i]);
for (var t = 0; length < radios.length; t++) {
if (radios[t].checked) {
var qResults = JSON.parse(localStorage["qResults"]);
num = radios[t].value;
checked = num.toString();
var temp = (id[0] + ";" + questions[i] + ";" + checked);
alert(temp);
qResults.push(temp);
localStorage["qResults"] = JSON.stringify(qResults);
}
}
alert("question finished");
}
Your inner loop is wrong. Change this:
for (var t = 0; length < radios.length; t++) {
to:
for (var t = 0; t < radios.length; t++) {
Side note: I would suggest that you read the local storage before the loops, and write it back after the loops, instead of doing it for every question.
In addition to Guffa's fix, I think it makes more sense if you can move var qResults and localStorage["qResults"] outside of the second for loop:
var qResults = JSON.parse(localStorage["qResults"]);
for loop I {
for loopII {}
}
localStorage["qResults"] = JSON.stringify(qResults);

javascript array traversal - efficiency

So, I have seen this piece of code at alot of places:
for (var i = 0, len = myArray.length; i < len; i++) {
}
I am aware that is the length caching of the array.
Today I saw this:
var len = myArray.length;
var i = 0;
while(i++ < len)
Efficiency wise, both would be the same, right? Any input would be appreciated.
If you have a "normal" loop, you can also change i < len to i !== len. This makes the loop a lot faster, because the the check for inequality is very fast. The caching of the variable is not so important, but it do no harm.
So a fast loop in javascript can written as follows:
for (var i = 0, len = myArray.length; i !== len; i++) {
}
UPDATE
I made some performance tests a while ago and this was what I found out. But nowadays the browsers don't show the same behaviour, furthermore it's the opposite (< is faster than !==) . Here is a test I made just now: http://jsperf.com/loop-inequality-check
So forget about the posting above ;)
Setup a jsperf test case here:
http://jsperf.com/javascript-array-length
for (i = 0; i < arr.length; i++) {
//nothing
}
var arrlength = arr.length;
for (i = 0; i < arrlength; i++) {
//nothing
}
var arrlength = arr.length,
i = 0;
while (arrlength > i++) {
//nothing
}
var arrlength = arr.length;
while (arrlength--) {
//nothing
}
If the test cases can be improved upon, please let me know in the comments. With a small number of tests, it seems IE11 is better optimized for the while cases, while Chrome 31 appears to prefer the second for loop (which is fairly similar to the while cases).

setting a variable to each element of an array

i have function:
function getFieldNames(arrayOfRecords) {
var theStuff;
for (var i = 0; i = arrayOfRecords.length - 1; i++){
theStuff = arrayOfRecords[i];
theList = theStuff.split('" ');
for (var j = 0; j = theList.length - 1; j++) {
var v = theList[j].split('="');
fName1[i][j] = v[0];
}
}
return fName1;
}
the argument arrayOfRecords is an array, and i dont know how to setup to the 'theStuff' variable an array element? When I do like it is above, i get something stupid.
can anyone help me? :)
There may be other problems but the one that leaps out at me is your for loop header:
for (var i = 0; i = arrayOfRecords.length - 1; i++)
The second part should be a condition, which when evaluated to false will stop the loop from running. What you probably wanted was:
for (var i = 0; i < arrayOfRecords.length; i++)
So when i is not less than arrayOfRecords.length, the loop will stop. Alternatively (to keep the - 1, but I tend to use the above version):
for (var i = 0; i <= arrayOfRecords.length - 1; i++)
The same goes for the nested loop.

Categories