Can anyone explain me the difference between these two loopings? - javascript

http://jsperf.com/jquery-each-vs-for-loop/108
for (var b = a[0], len = a.length; len; b = a[--len]) {
newArray.push(
b
);
}
and
for (var i = 0, len = a.length; i < len; i++) {
newArray.push(
a[i]
);
}
According to jsref, it says the first one is faster. why?
Can anyone explain me the for loop on whats its doing compared to traditional way?

Your first example just does something very different. Check it out:
var a = [1,2,3,4],
newArray = [];
for (var b = a[0], len = a.length; len; b = a[--len]) {
newArray.push(b);
}
> newArray
[1, 4, 3, 2]
Your second example results in the expected [1, 2, 3, 4].
If you need to understand the algorithms, it might be easier when converting the for-notation to while-loops and to expand the decrement and increment operators:
/* first example */
var b = a[0],
len = a.length;
while (len) {
newArray.push(b);
len = len-1;
b = a[len];
}
/* second example */
var i = 0,
len = a.length;
while (i < len) {
newArray.push( a[i] );
i = i+1;
}

I think the major gain of the first loop is that a is being cached in len and then used as a single boolean value : there's a little time to be gained by simplifying the loop condition. However! It will not produce the same array as output.
Assume you have ten elements in a : [0,1,2,3,4,5,6,7,8,9] -- the loop will process a[0] first, then a[--len], which is a[9] in our example. Your end result will be newArray = [0, 9, 8, 7, 6, 5, 4, 3, 2, 1].
So it doesn't matter why it's faster, because it's doing the wrong thing.

Related

Javascript for loop and splice function

Good day, I have been trying to solve JS problem where I have an array a = [1, 1, 1, 2, 1, 3, 4]. I have to loop through an array and remove every three elements ie (1,1,1) do some logic, then the next three (1,1,2), and so on.
I have used for loop and splice
a = [1, 1, 1, 2, 1, 3, 4]
tuple = ()
for(j=0; j < a.length; j++){
tuple = a.splice(j, 3)
}
However, loop would not go beyond first round of (1,1,1).
What would be the correct way to loop through this array and remove sets of every three elements.
thank you.
Splice return removed elements from base array in given range. You probable want to use slice which only copy them and doesn't change primary array. You can also check this solution.
let a = [1, 1, 1, 2, 1, 3, 4];
for (j = 0; j < a.length; j++) {
if ( j < a.length - 2 ) {
const touple = [ a[j], a[j+1], a[j+2] ]
console.log( touple )
}
}
splice changes the original array and that must be causing your issue.
So, you can use slice which returns a shallow copy of a portion of the original array (without modifying the original array):
const a = [1, 1, 1, 2, 1, 3, 4]
const doLogic = (arr) => {
console.log(JSON.stringify(arr)) // JSON.stringify is only for one-liner print. You can ignore it.
}
for (let i = 0; i < a.length - 2; i++) {
const picked = a.slice(i, i + 3)
doLogic(picked)
}
Or this, if you want to pick the full array when length is less than 3:
if (a.length < 3) {
doLogic(a)
} else {
for (let i = 0; i < a.length - 2; i++) {
const picked = a.slice(i, i + 3)
doLogic(picked)
}
}

How to write my reverse function properly?

i have a problem and i need help for this question.
My reverse function doesn't work the way I want it to.
function reverseArrayInPlace(array){
let old = array;
for (let i = 0; i < old.length; i++){
array[i] = old[old.length - 1 - i];
};
};
let arrayValue = [1, 2, 3, 4, 5];
reverseArrayInPlace(arrayValue);
console.log(arrayValue);
I expect on [5, 4, 3, 2, 1] but i have [5, 4, 3, 4, 5].
Why does it work this way? Please help me understand.
P.S I know about the reverse method.
Variable, with assigned object (array, which is a modified object in fact) - stores just a link to that object, but not the actual object. So, let old = array; here you just created a new link to the same array. Any changes with both variables will cause the change of array.
(demo)
let arr = [0,0,0,0,0];
let bubu = arr;
bubu[0] = 999
console.log( arr );
The simplest way to create an array clone:
function reverseArrayInPlace(array){
let old = array.slice(0); // <<<
for (let i = 0; i < old.length; i++){
array[i] = old[old.length - 1 - i];
};
return array;
};
console.log( reverseArrayInPlace( [1, 2, 3, 4, 5] ) );
P.s. just for fun:
function reverseArrayInPlace(array){
let len = array.length;
let half = (len / 2) ^ 0; // XOR with 0 <==> Math.trunc()
for( let i = 0; i < half; i++ ){
[ array[i], array[len - i-1] ] = [ array[len - i-1], array[i] ]
}
return array;
};
console.log( reverseArrayInPlace( [1, 2, 3, 4, 5] ) );
If you're writing a true in place algorithm, it's wasteful from both a speed and memory standpoint to make an unnecessary copy (as other answers point out--array and old are aliases in the original code).
A better approach is to iterate over half of the array, swapping each element with its length - 1 - i compliment. This has 1/4 of the iterations of the slice approach, is more intuitive and uses constant time memory.
const reverseArrayInPlace = a => {
for (let i = 0; i < a.length / 2; i++) {
[a[i], a[a.length-1-i]] = [a[a.length-1-i], a[i]];
}
};
const a = [1, 2, 3, 4, 5];
reverseArrayInPlace(a);
console.log(a);
Since this is a hot loop, making two array objects on the heap just to toss them out is inefficient, so if you're not transpiling this, you might want to use a traditional swap with a temporary variable.
function reverseArrayInPlace(a) {
for (var i = 0; i < a.length / 2; i++) {
var temp = a[i];
a[i] = a[a.length-i-1];
a[a.length-i-1] = temp;
}
};
var a = [1, 2, 3, 4];
reverseArrayInPlace(a);
console.log(a);
You have in old variable the same array (not by value, but by reference), so if you change any of them you'll have changes in both.
So you should create new array, make whatever you want with them and return it (or just copy values back to your origin array if you don't want to return anything from your function).
It happend like that because:
1) arr[0] = arr[4] (5,2,3,4,5)
2) arr[1] = arr[3] (5,4,3,4,5)
....
n) arr[n] = arr[0] (5,4,3,4,5)
So you can just make a copy (let old = array.slice()) and it'll be woking as you'd expect.

search for matching values in two arrays with repeated values in javascript

I have two arrays:
a = [2,2,3,0,6]
b = [6,3,2,2,0]
I am trying use for loop to match values and get the index of a in a new array c. How can we do this? Notice that there are multiple values which match and so I think the previous match must be skipped.
This is a proposal which respects the last index and looks further.
How it works:
It uses Array#map for iterating array b with a callback. map gets an own this space with an really empty object Object.create(null).
The callback has on parameter bb which is one element of `b.
Next is to find the element is in array a with a Array#indexOf and a fromIndex, based on the former searches. The former index is stored in the this object, as long as the result is not -1, because this would reset the fromIndex to zero.
If there is no this[bb] or a falsy value of this[bb] take zero as fromIndex.
Later, a found index is incremented and stored in this[bb].
At least, the index is returned.
var a = [2, 2, 3, 0, 6],
b = [6, 3, 2, 2, 0],
c = b.map(function (bb) {
var index = a.indexOf(bb, this[bb] || 0);
if (index !== -1) {
this[bb] = index + 1;
}
return index;
}, Object.create(null));
console.log(c);
Another solution could be first generate an object with all indices of a and use it in the iteration of b for returning the indices.
The example is a bit extended, to show what happen if there is no more than two indices (2) and one without being in a (7).
The content of aObj with all indices of a:
{
"0": [3],
"2": [0, 1],
"3": [2],
"6": [4]
}
var a = [2, 2, 3, 0, 6],
b = [6, 3, 2, 2, 0, 7, 2],
aObj = Object.create(null),
c;
a.forEach(function (aa, i) {
aObj[aa] = aObj[aa] || [];
aObj[aa].push(i);
});
c = b.map(function (bb) {
return aObj[bb] && aObj[bb].length ? aObj[bb].shift() : -1;
});
console.log(c);
As far I Understand, You can try this:
var a = [2,2,3,0,6];
var b = [6,3,2,2,0];
var c = new Array();
for(i = 0; i < b.length; i++)
{
for(j = 0; j < a.length; j++)
{
if(b[i] === a[j] && c.indexOf(j) < 0)
{
c.push(j);
break;
}
}
}
console.log(c); // [4, 2, 0, 1, 3]
FIDDLE DEMO HERE
If I understand correct.
let c = a.map(i => b.indexOf(i))
or
var c = a.map(function(i) { return b.indexOf(i); });
loop .map function and check same value by indexOf
indexOf will return a number,representing the position where the specified search value occurs for the first time, or -1 if it never occurs
var arr = [];
a.map(function(v){
if(b.indexOf(v) > -1){
arr.push(v);
}
});
console.log(arr);
try something like this
var a = [2,2,3,0,6];
var b = [6,3,2,2,0];
var arrayLength_a = a.length;
var arrayLength_b = b.length;
var new_array=[];
for (var i = 0; i < arrayLength_a; i++)
{
for (var j = 0; j < arrayLength_b; j++)
{
if (a[i] == b[j])
{
if(new_array.indexOf(a[i]) === -1)
{
new_array.push(a[i]);
}
}
}
}

Array conversion from string to int crashes the browser

I am trying to convert an array of strings to an array of integers in javascript. I saw the following solution in a coupple of threads here and in a couple of other sources so I fuigure it must be correct, however when I get to the conversion the browser crashes. I have tried with Chromium and Firefox.
Here is the source code, I am interested in what is causing this and what can be fixed:
var str = "1,2,3,3,4,5,6";
var arr1 = str.split(",");
console.log(arr1);
for(var k=0; k<=arr1.length; k++) { arr1[k] = +arr1[k]; }
In addition to the given answer, you may want to use this oneliner to create the array:
var arr1 = '1,2,3,4,5,6,7'.split(',').map(function(a){return +a;});
MDN page for Array.map
The problem is in this expression
k<=arr1.length
When k is 6, k++ increments k and it becomes 7. And then k <= arr1.length is true because arr1.length is 7. The next statement is
arr1[k] = +arr1[k];
which creates a new element in the array at index 7. So the array keeps on growing infinitely. What you should have done is
var arr1 = "1,2,3,3,4,5,6".split(",");
for (var k = 0; k < arr1.length; k++) {
arr1[k] = +arr1[k];
}
console.log(arr1);
# [ 1, 2, 3, 3, 4, 5, 6 ]
Iterate only till the counter is lesser than length of the array. Otherwise store the length of the array in a temporary variable like this
for (var k = 0, len = arr1.length; k < len; k++) {
arr1[k] = +arr1[k];
}
You can write the same as, simply
console.log("1,2,3,3,4,5,6".split(",").map(Number));
# [ 1, 2, 3, 3, 4, 5, 6 ]

Javascript: Multiple Array looping

TL DR; What is the most efficient way to sort and compare values in a multiple arrays?
Okay, so we'll assume a few constants to make this whole thing simple
var a = [1, 2, 3, 4, 5, 6], b = [0, 9, 8, 7, 6, 88, 99, 77], i, j;
Now if I wanted to see if any value in a is equal to any other value in b I'd have to sort through one of these arrays 6 times. That's a lot of work, and it would seem there should be a more efficient way to do this. For those needing a visual aide here you are ( and yes I know about -- and ++ I just don't like to use 'em ):
for (i = a.length - 1; i > -1; i -= 1) {
for (j = b.length - 1; j > -1; j -= 1) {
if (a[i] === b[j]) {
return b[j];
}
}
}
The B array gets ran through once for EACH element in A. Again, certainly there is a more efficient way to complete this task?
-Akidi
Depends on the size of your input arrays (several tradeoffs there)-- your nested loops are simplest for small inputs like your examples.
If you have huge arrays, and have control over their construction, consider keeping a map (Object in JS) around acting as a lookup set (if you're creating a in a loop anyways, you can build the set in parallel.)
var setA = {};
for (int i = 0; i < a.length; i++) {
setA[a[i]] = true;
}
Then you can see whether something exists in the set by just checking setA[?].
Likewise with B, or with both together, etc, depending on your needs.
Maybe something like this may help?
var a = [1, 2, 3, 9, 5, 0], b = [0, 9, 8, 7, 6, 88, 99, 77];
var a_dict = {}, l = a.length;
for (var i=0; i < l; i++) {
a_dict[a[i]] = 1;
}
l = b.length;
for (var i=0; i < l; i++) {
if(!!a_dict[b[i]]){
console.log(b[i]);
}
}
You can convert one array to "dict-like" object and compare others with it...

Categories

Resources