for loop and variable scope

Question

I'm trying to figure out the best way to do something. I have a variable that acts as a HTML template, and insert properties from an array of objects. Simple code below:

i = 0;
v =  "<li>",
v += array[i].prop,
v += "</li>";

Array of objects:

array = new Array();
array[0] = { name: "1",
             prop: "Property 1"
           }
array[1] = { name: "2",
             prop: "Property 2"
           }

This is the bit thats getting me:

for (; i < array.length ;) {
    i += 1;
    console.log(i);
    $("body").append(v);
}

i returns as 0 and 1 in the console, but the prop value returns as "Property 1" twice. As far as I'm aware, since I haven't declared i in the for loop it should be returning the new value of i to the originally declared variable. This is obviously a scope issue that I'm missing/don't understand.

Thanks in advance.

What do you mean by "returning the new value of i to the originally declared variable"? — cHao
– cHao, Commented Jun 13, 2013 at 2:40
This is probably not a scope issue so much as a an order of execution issue. In what order is the actual code? (In the code you posted, you are using i in the assignment to v before you are assigning anything to i. Is that what actually happens?) Do you have any var declarations? — Ted Hopp
– Ted Hopp, Commented Jun 13, 2013 at 2:40
@cHao: i increases with each iteration, but isn't declared within the loop so its sits globally to the loop (I don't know the proper terminology...) — Jay
– Jay, Commented Jun 13, 2013 at 2:44
@TedHopp: The code is essentially that with a much longer "v" variable and a much longer set of object properties. I can get this to work if I declare i like this: for (i = 0; ....; i++) and I move the variable v into the loop scope, but this isn't ideal for this situation. — Jay
– Jay, Commented Jun 13, 2013 at 2:46
@JamieStrauss - v is not reassigned inside the loop, how is it expected to change? — Igor
– Igor, Commented Jun 13, 2013 at 2:54

Igor · Accepted Answer · 2013-06-13 02:57:14Z

2

v is not reassigned inside the loop. You append the same value multiple times.

answered Jun 13, 2013 at 2:57

Igor

15.9k1 gold badge29 silver badges34 bronze badges

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

Comments

Greendrake · Accepted Answer · 2013-06-13 02:45:34Z

1

Not exactly sure what your problem is, but in terms of "best way to do something" I would go:

var array = [
        {
            name: "1",
            prop: "Property 1"
        },
        {
            name: "2",
            prop: "Property 2"
        }   
    ],
    i = 0,
    v;
for (; i < array.length; i++) {
    v = '<li>' + array[i].prop + '</li>';
    $("body").append(v);
}

answered Jun 13, 2013 at 2:45

Greendrake

3,7643 gold badges20 silver badges29 bronze badges

1 Comment

Jay Over a year ago

This is how its done, I only changed it to explicitly stated indexes to make the question clearer...

Collectives™ on Stack Overflow

for loop and variable scope

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related