does caching array length for a loop condition affect performance? - javascript

Is there a big difference between
for (var i = 0, c = data.length; i < c; i++) {
}
And
for (var i = 0; i < data.length; i++) {
}
What is the difference?

In the first code, the length of the array(or array-like collection) is calculated only once and it it cached. So, the length is not recalculated per each iteration.
While in the second code, the length is calculated per iteration.
You can say that caching the length will be slightly faster than recalculating the length. This difference will be very very small that you can neglect this for smaller arrays. But for huge array, the difference could be significant.
Which way to use totally depend on the use case.
If the array length is updated inside the loop must use the second code.
for (var i = 0; i < data.length; i++) {
// Useful when the data length is altered in here
}

each time you are calculating data.length in
for (var i = 0, c = data.length; i < c; i++) {}

Related

How to loop through all possible pairs of JSON object keys exactly once?

Say that I have a data structure of n elements and a function check(element1, element2) which performs some kind of checkup on two elements. I need to check exactly all possible pairs of elements. Using combinatorics it is easy to deduce that we need to perform exactly 'n choose 2' binomial coefficient iterations ( n*(n-1)/2 iterations)
So if my data structure is an array, the following nested loops would work:
for(let i = 0; i < elements.length; i++) {
for(let j = i + 1; j < elements.length; j++) {
check(elements[i], elements[j]);
}
}
This way we check the first element with all the others, the second element with elements 3 to n (since we already checked it with the first one), the third with elements 4 to n and so on and so forth. However if 'elements' was a JSON where the key to each element is not an integer, how can we achieve this effect? Obviously we can ensure that we perform all checkups with the following code:
for(var key1 in elements) {
for(var key2 in elements) {
if(key1 != key2) {
check(elements[key1], elements[key2]);
}
}
}
However obviously we are doing a lot of checkups more than once resulting in n^2 iterations.
What method can I use to achieve the same result as in the example with the array?
If you put all the keys you're going to be looping into an array using Object.keys() then you can use your standard for loop to "skip" over previously seen keys like so:
const keys = Object.keys(elements);
for(let i = 0; i < keys.length; i++) {
const key1 = keys[i];
for(let j = i + 1; j < keys.length; j++) {
const key2 = keys[j];
check(elements[key1], elements[key2]);
}
}
Perhaps you could get the list of keys in an array:
let elements = { a: 1, b: 2, c: 3 };
let keys = Object.keys(elements).sort(); // Sorts the keys array alphabetically, and thus simulating the numbers example and be sure you're not repeating "lower" order key after passing it
for(let i = 0; i < keys.length; i++) {
for(let j = i + 1; j < keys.length; j++) {
// check(elements[keys[i]], elements[keys[j]]);
console.log(elements[keys[i]], elements[keys[j]])
}
}
output:
1 2
1 3
2 3

For loop withoit indexes javascript

I want to display an array without showing of indexes. The for loop returns the array indexes which is not showing in usual declaration.
I want to send an array like [1,2,3 ...] but after retrieving from for loop, I haven't the above format. How can I store my values as above.
var a = [];
for (var i = 1; i < 8; i++) {
a[i] = i;
};
console.log(a);
Outputs:
[1: 1, 2: 2 ...]
Desired output:
[1,2,3]// same as console.log([1,2,3])
Array indices start at zero, your loop starts at 1, with index 0 missing you have a sparse array that's why you get that output, you can use push to add values to an array without using the index.
var a = [];
for (var i = 1; i < 8; i++) {
a.push(i);
};
console.log(a);
The problem is that you start your array with 1 index, making initial 0 position being empty (so called "hole" in array). Basically you treat array as normal object (which you can do of course but it defeats the purpose of array structure) - and because of this browser console.log decides to shows you keys, as it thinks that you want to see object keys as well as its values.
You need to push values to array:
var a = [];
for (var i = 1; i < 8; i++) {
a.push(i);
};
I have to disagree with the answers provided here. The best way to do something like this is:
var a = new Array(7);
for (var i = 0; i < a.length; i++) {
a[i] = i + 1;
}
console.log(a);
Your code is making each index equal to i, so use it this way
var a = [];
for (var i = 1; i < 8; i++) {
a.push(i);
};
console.log(a);

finding an array in another Multidimensional array in javascript

I'm writing a simple snakes game using JavaScript and HTML5 canvas.
I have a Multidimensional array that hold snake block like this:
snake=[[1,1],[1,2]];
and set it on arrayMap using (snake.indexOf([i],[j])!=-1) then draw arrayMap on canvas.
for (var i = 0; i < blocksHeightCount; i++) {
for (var j = 0; j < blocksWidthCount; j++) {
if ((snake.indexOf(i,j)!=-1)||
(walls.indexOf(i,j)!=-1)||
(foods.indexOf(i,j)!=-1)) {
arrayMap[i][j]=1;
} else {
arrayMap[i][j]=0;
}
}
}
for (var i = 0; i < blocksHeightCount; i++) {
for (var j = 0; j < blocksWidthCount; j++) {
Block = arrayMap[i][j];
if (Block!=0){
ctx.fillStyle = (Block != 9) ? colors[Block]
: "#bdc3c7";
ctx.fillRect(j * cubeWidth, i * cubeHeight
, cubeWidth-.4,cubeHeight-.4);
}
}
}
the problem is indexOf isn't working when I set array on it!
It works fine when I set indexOf("i,j") but i need it to be array.
please help, thx
First solution : using Array.map
Each element of your arrays snake, walls and foods is an array with 2 elements. So to check if an [x,y] exists in one of the arrays you need a simple way to
compare two arrays [x1, y1] and [x2, y2]. Comparing arrays directly using the operator == will compare their references and not values (Thanks #Elena for the remarque). A way to compare values
would be to affect a hash to each array and compare hashes. By hash I mean a number which is unique for each array of type [x, y]. That could be x * blocksWidthCount + y
in your case and the code will be :
function getHash(x, y){
return x * blocksWidthCount + y;
}
var blockHashes = snake.concat(walls).concat(foods).map(function(cell) {
return getHash(cell[0], cell[1]);
}); // hashes of all blocks in one array
for (var i = 0; i < blocksHeightCount; i++) {
for (var j = 0; j < blocksWidthCount; j++) {
if (blockHashes.indexOf(getHash(i, j)) != -1) {
arrayMap[i][j]=1;
} else {
arrayMap[i][j]=0;
}
}
}
Second Solution Changing the way we see things
Instead of looping over all cells and verifying if every single cell is a block which gives a complexity of O(N * M) (N number of cells and M number of blocks).
We can do better simply by supposing that there is no block and then loop over blocks and mark them as blocks which is in O(N + M) !
function markBlock(cell){
arrayMap[cell[0]][cell[1]] = 1;
}
for (var i = 0; i < blocksHeightCount; i++)
for (var j = 0; j < blocksWidthCount; j++)
arrayMap[i][j] = 0;
snake.forEach(markBlock);
walls.forEach(markBlock);
foods.forEach(markBlock);

How should I represent data for effective searching and comparing strings

I have two array with length 300. They look like this (JSON representation):
[
[
["word1",0.000199],
["word2",0.000102],
...
["word15",0.000102]
],
...
[
["anotherword1",0.0032199],
["anotherword2",0.032302],
...
["anotherword15",0.0320102]
]
]
And I have this bruteforce algorithm:
for(var i = 0; i < 300; i++)
{
for(var j = 0; j < 15; j++)
{
for(var ii = i + 1; ii < 300; ii++)
{
for(var jj = 0; jj < 15; jj++)
{
for(var jjj = 0; jjj < 15; jjj++)
{
if(new_keywords[i][j][0] === new_keywords[ii][jj][0] && new_keywords[ii][jj][0] === state_keywords[i][jjj][0])
{
console.log(0);
}
}
}
}
}
}
I need to search for same words in those arrays and if words are the same, then I sum values and divide sum by 3 and replace that value in state_keywords array. So for each word which is more then once in array I have means of its values.
Now... my approach is very bad because I have now about 300 mil iterations and that is crazy. I need some better implementation of my array in JavaScript. Something like lexikographical tree or kd-tree or something.
Thank you.
EDIT:
Here is http://jsfiddle.net/dD7yB/1/ with example.
EDIT2:
I'm sorry if I'm not clear enough. So what exaclty I'm doing:
I have array state_keywords. Indexes are from 0 to 299 and they representing a themes...
Each theme may be represented by 15 words and every time new_keywords array arrives, they may be different.
When new_keywords array arrive I need to check every word in that array if it is in state_keywords array on same theme index.
If it is: add probabilities up and divide by 2.
If it is not: add new word into state_keyword array BUT if they are more than 15 words for one theme (which now are) I need to store just first 15 sorted by probabilities.
And this I need to do as effectively as possbile, because I need to do this every second so it must be FAST.
EDIT3:
Now I use this code:
var i, j, jj, l;
for(i = 0; i < 300; i++)
{
for(j = 0; j < 15; j++)
{
l = new_keywords[i].length;
for(jj = 0; jj < l; jj++)
{
if(state_keywords[i][j][0] === new_keywords[i][jj][0])
{
state_keywords[i][j][1] = (state_keywords[i][j][1] + new_keywords[i][jj][1]) / 2;
}
}
}
}
which is much faster then the previous one.
Why don't you make those arrays into objects with the strings as keys to the values? Then you can just just look up the words directly and get the values?
var wordlists = [
{
"word1":0.000199,
"word2":0.000102,
...
"word15":0.000102
},
...
{
"anotherword1":0.0032199,
"anotherword2":0.032302,
...
"anotherword15":0.0320102
}
]
and then lookup with
wordlists[0]["word2"] //0.000102

Why is iterating through an array backwards faster than forwards

Given this code:
var arr = [];
for (var i = 0; i < 10000; ++i)
arr.push(1);
Forwards
for (var i = 0; i < arr.length; ++i) {}
Backwards
for (var i = arr.length - 1; i >= 0; --i) {}
Hard-coded Forward
for (var i = 0; i < 10000; ++i) {}
Why is backwards so much faster?
Here is the test:
http://jsperf.com/array-iteration-direction
Because your forwards-condition has to receive the length property of your array each time, whilst the other condition only has to check for "greater then zero", a very fast task.
When your array length doesn't change during the loop, and you really look at ns-perfomance, you can use
for (var i=0, l=arr.length; i<l; i++)
BTW: Instead of for (var i = arr.length; i > 0; --i) you might use for (var i = arr.length; i-- > 0; ) which really runs through your array from n-1 to 0, not from n to 1.
Because in the first form you are accessing the property length of the array arr once for every iteration, whereas in the second you only do it once.
If you want to have them at same pace, you can do that for forward iteration;
for(var i=0, c=arr.length; i<c; i++){
}
So, your script won't need to take length of array on everystep.
I am not entirely sure about this, but here is my guess:
For the following code:
for (var i = 0; i < arr.length; ++i) {;
}
During runtime, there is an arr.length calculation after each loop pass. This may be a trivial operation when it stands alone, but may have an impact when it comes to multiple/huge arrays. Can you try the following:
var numItems = arr.length;
for(var i=0; i< numItems; ++i)
{
}
In the above code, we compute the array length just once, and operate with that computed number, rather than performing the length computation over and over again.
Again, just putting my thoughts out here. Interesting observation indeed!
i > 0 is faster than i < arr.length and is occurring on each iteration of the loop.
You can mitigate the difference with this:
for (var i = 0, len = arr.length; i < len; ++i) {;
}
This is still not as fast as the backwards item, but faster than your forward option.
do it like below, it will perform in same way. because arr.length takes time in each iteration in forward.
int len = arr.length;
forward
for (var i = 0; i < len; ++i) {
}
backward
for (var i = len; i > 0; --i) {
}
And these are equally good:
var arr= [], L= 10000;
while(L>-1) arr[L]= L--;
OR
var arr= [], i= 0;
while(i<10001) arr[i]=i++;

Categories

Resources