Why doesn't this loop do what I can do manually?

Question

I have a function that doesn't work:

function gapAll( ary2, ary )//perform gap() on all of the values of ary2
{
    for( i = 0; i < ary2.length; i++ )
    {
        gap( ary2[ i ], ary );
    }
}

If I perform this manually, it works:

function gapAll( ary2, ary )//perform gap() on all of the values of ary2
{
    gap( 0, ary );
    gap( 1, ary );
    gap( 2, ary );
    gap( 3, ary );
    gap( 4, ary );
    gap( 5, ary );
    gap( 6, ary );
    gap( 7, ary );
    gap( 8, ary );
    gap( 9, ary );
}

My goal is to do this with a loop, not manually. below is all of my code...I cant figure this out...I just want to loop through ary2's indexes and use them for gap. I've shortened my code to only items used by this function:

<!DOCTYPE html>
<html>
    <head>
        <meta charset = "utf-8">
        <title>test</title>

        <style>
            html
            {
                background-color: #0f0f0f;
                color: #ccc;

                font-family:Arial;
                font-size:90%;
            }
        </style>
    </head>

    <body>
        <header>
        </header>

        <section id = "body">
            <h3>result</h3>
            <p id = "trg">...</p>
        </section>

        <footer>
        </footer>   

        <script>
            /*|||||||||||||||||||||||||||||||||||||| BASE ARRAYS ||||||||||||||||||||||||||||||||||||||*/

            digits = [];//digits 1 - 9
            for( i = 0; i < 10; i++ )
            {
                digits.push( i );
                window[ 'digit' + i ] = 0;
            } digitsCpy = digits.slice( 0 );


            /*||||||||||||||||||||||||||||||||||||||| FUNCTIONS |||||||||||||||||||||||||||||||||||||||*/


            function gapAll( ary2, ary )//gap
            {
                for( i = 0; i < ary2.length; i++ )
                {
                    gap( ary2[ i ], ary );
                }
            }

            function gap( v, ary )//gap
            {
                v = v.toString();
                places = [];
                if( v.toString().length == 1 )  
                {
                    var counter = 0;
                    var identifier = new RegExp( v );
                    for( i = 0; i < ary.length; i++ )
                    {
                        if( identifier.test( ary[ i ] ) == true )
                        {  places.push( i ) }
                    } 

                    var gaps = places.slice( 0 );

                    for( i = 0; i < places.length; i++ )
                    {
                        if( i > 0 )
                        {
                            j = i - 1;
                            gaps[ i ] = places[ i ] - places[ j ] - 1;
                        }
                    } 

                    window[ 'digit' + v ] = gaps.slice( 0 );

                    if( window[ 'digit' + v ] == ''  )
                    { window[ 'digit' + v ] = 0; }
                }
                else if( v.toString().length == 2 )
                {
                    x = v.slice( 0, 1 );
                    y = v.slice( 1, 2 );

                    var counter = 0;
                    var identifier = new RegExp( x + ".*" + y + "|" + y + ".*" + x );
                    for( i = 0; i < ary.length; i++ )
                    {
                        if( identifier.test( ary[ i ] ) == true )
                        { places.push( i ) }
                    } 

                    var gaps = places.slice( 0 );

                    for( i = 0; i < places.length; i++ )
                    {
                        if( i > 0 )
                        {
                            j = i - 1;
                            gaps[ i ] = places[ i ] - places[ j ] - 1;
                        }
                    } 

                    window[ 'pair' + v ] = gaps.slice( 0 );

                    if( window[ 'pair' + v ] == ''  )
                    { window[ 'pair' + v ] = 0; }
                }
                else if( v.toString().length == 3 ) 
                {
                    x = v.slice( 0, 1 );
                    y = v.slice( 1, 2 );
                    z = v.slice( 2, 3 );

                    var counter = 0;
                    var identifier = new RegExp
                    ( 
                        x + ".*" + y + ".*" + z + "|" + x + ".*" + z + ".*" + y + "|" + 
                        y + ".*" + x + ".*" + z + "|" + y + ".*" + z + ".*" + x + "|" + 
                        z + ".*" + x + ".*" + y + "|" + z + ".*" + y + ".*" + x 
                    );
                    for( i = 0; i < ary.length; i++ )
                    {
                        if( identifier.test( ary[ i ] ) == true )
                        { places.push( i ) }
                    } 

                    var gaps = places.slice( 0 );

                    for( i = 0; i < places.length; i++ )
                    {
                        if( i > 0 )
                        {
                            j = i - 1;
                            gaps[ i ] = places[ i ] - places[ j ] - 1;
                        }
                    } 
                    window[ 'set' + v ] = gaps.slice( 0 );

                    if( window[ 'set' + v ] == ''  )
                    { window[ 'set' + v ] = 0; }
                }
            }

            function addDim( m )//add dimension to m
            {
                if( Array.isArray( m ) )
                {
                    for( i = 0; i < m.length; i++ )
                    {
                        if( m[ i ].length > 1 )
                        {
                            m[ i ] = m[ i ].split( '' );
                        }
                    }
                    return m;
                }
                else
                {
                    ary = m.split( ' ' );
                    return ary;
                }
            }

            /*|||||||||||||||||||||||||||||||||||||||   MAIN   ||||||||||||||||||||||||||||||||||||||||*/

            ary = [ 409,879,483,465,907,154,838,847,432,434,842,401 ];
            gapAll( digits, ary );
            document.getElementById( 'trg' ).innerHTML = digit3;
        </script>
    </body>
</html>

Just to make this easier to understand the whole idea of the gap( v, ary ) function is to find "gaps" or the space in between values in arrays. so if i was looking for 5 in the array [ 5, 2, 5 ]. gap( 5, ary) would return ( 0, 1 ). because 5 was at the first index( 0 ), and then it skipped 1 index (2) before repeating at the 3rd index.

This may be something simple as I am a newbie. Thanks for any help provided.

Continuation from @U2744SNOWFLAKE - In your loop declaration, you should have `var i` instead of just `i` — SirPython, Dec 20 '14 at 23:32

score 7 · Accepted Answer · edited May 23 '17 at 12:18

All your i variables are globally-scoped! This means that all your for loops are using the exact same counter variable, and when you use different loops in different functions, it messes with the global counter state. You can fix this by using the var keyword whenever you declare local variables, like so:

function gapAll(ary2, ary) {
    for(var i = 0; i < ary2.length; i++) {
        gap(ary2[i], ary);
    }
}

You should similarly update all your other variable declarations to use var, otherwise they'll continue to pollute the global scope and can cause serious problems like you've already observed. This includes both loop counter variables and function-local declarations.

See also: What is the function of the var keyword and when to use it (or omit it)?

didn't realize how important staying away from global variables were, I changed all of my `for( i `'s to `for( var i` and it worked like a charm. THANKS! — , Dec 20 '14 at 23:52

Elliott Frisch · Answer 2 · 2014-12-20T23:40:53.340

4

Your two functions aren't doing the same thing. First, your should scope the variable i and then your manual version would be more like

for (var i = 0; i < ary2.length; i++) {
    gap(i, ary);
}

Edit

If it was coincidental to your unrolled version, then use

for (var i = 0; i < ary2.length; i++) {
    gap(ary2[i], ary);
}

edited Dec 20 '14 at 23:40

answered Dec 20 '14 at 23:33

Elliott Frisch

198,278
20
158
249

The problem is that `i` will not always equal `ary[ i ]` in my code. In my example it does, but I have other arrays where the value of `i` does not equal the index exactly. – Dec 20 '14 at 23:39
1

can you post a different scneario for manual that would show the case where i is not same as ary[i] – Muhammad Umer Dec 20 '14 at 23:40
@carb0nshel1 Edited. Sounds like the unrolled version was a coincidence. – Elliott Frisch Dec 20 '14 at 23:41
`ary2[ i ]` will be the value of that index in `ary2`. in this case im calling the `gapAll` function with `gapAll( digits, ary );` (at the bottom of my code ). the digits array is literally [ 0, 1, 2, 3, 4, 5 - etc ] all the way to 9. Yet if i swap digits with another array i'm using called `pairs`. it wouldn't work. pairs = [ 00, 01, 02, etc ] all the way to 99. – Dec 20 '14 at 23:45

Why doesn't this loop do what I can do manually?

2 Answers2