12. Loops and Arrays II (Why does this work?)


Hello, all. I'm posting my working code for this exercise here both as a model for those who might be struggling to get theirs correct, but also because I find it odd that there isn't a problem with the first printout. The variable "i" defined in the loop starts at 0. Why then is there not a problem with the first printout? I realize that the third parameter (i++) is printing the first piece of data from the array, but it's "i++" and not "++i" which is to say the first item printed should be the variable "i" before it is manipulated. What am I missing? Thanks in advance.


var names = ["Mark", "Betty", "Sam", "Ginger", "Hugh"];
for (var i = 0; i < names.length; i++) {
    console.log("I know someone called " + names[i]);   


in the beginning i = 0, then i checks if condition is met 0 < 5 is true, then i gets increased, so now i is one. Then something gets logged to the console.

Second run of the for loop. 1 < 5 is true, then i is increased, then something is logged to the console, and so on until hits are are logged to the console


Thank you for the response, stetim94. However, I had read a couple of days ago that "i++" adds the increment AFTER the variable and that "++i" adds it before the variable. According to that logic, we should be using "++i" to print the first part of the array. It seems to me after doing this exercise, that I understand that incorrectly.


Where did you read this? And sure this was for javascript?


Well as all loops are interchangeable let's write the for loop as a while loop that does exactly the same:

    for (var i = 0; i < names.length; i++) {
        console.log("I know someone called " + names[i]); 

would be:

    var i=0;
    while( i < names.length){
        console.log("I know someone called " + names[i]); 

Explained that in further details and examples here:

Anyway as you can see the i++ is executed after the actual loop successfully ran and before the next loop starts. And at this position it simply doesn't matter whether it is i++ or ++i as they both serve the purpose of increasing by one. The order only matters if you directly use the value of i++ or ++i e.g. something more fancy like this here:

    for (var i = 0; i < names.length;) {
        console.log("I know someone called " + names[i++]); 

in this case i++ has a value of i and after the statement i would have a value of i+1. So in this case you start at 0 use that the statement i++ has a value of 0 and after the statement i would have a value of 1. ++i wouldn't work that well here because it would increase the value by 1 as well but the statement ++i would already have the new value of i+1. Hope this makes it clear but if there are still questions feel free to ask.


Why would "console.log(i); -->1 if var i = 0; ???



You are missing nothing.
In this particular exercise, it asks you to print out every name inside the array names by using the for loop. First, you create the** array names** which will contain names of people. You put double quotes because it's a string and separate each item in the array with a** comma**. You put a semicolon right after declaring your variable to end the instruction and use the** for loop** to iterate over the array names. First you create a variable named i which will be the counter for indexing the item inside of your array. Its value will be set at 0, knowing that 0 is the first item in an array. As long as the I variable is smaller than the length of the names array, it will increment variable i and print in the console "I know someone called " + names[i]);. For the names[i] part, it will choose the item inside the names array by the value of variable i so per example if the current value was 3, it will print out the fourth item since the index starts by 0.
Hope this helped out.


If you use i++ or ++i in the for loop doesn't matter, you can add a console.log(i), you will see this make no difference


On the difference of i++,++i and i+=1. What you need to do is that you need to distinguish between the purpose and the value of these statements. So let's see them in action:

    var i=0;
    console.log(i++); --> 0
    console.log(i); --> 1

As you can see here the value of i++ is i which is in this case 0 but the purpose it serves is increasing i by 1.

    var i=0;
    console.log(++i); -->1
    console.log(i); -->1

Same on the purpose here, but as you can see the value of the statement itself is already i+1 here 1.

    var i=0;
    console.log(i+=1); -->1
    console.log(i); --> 1

Same here value is i+1 and purpose is i+1 as well. Here it is also rather intuitive, because i+=1 is just a shortcut for i=i+1 and any assignment statements value is the value you assign, so as you assign i+1 here it is i+1.

So as you can see they all serve the same purpose of increasing i by 1 which means that if you use them on an own line not bothering about the value they are all alike but when you use them in a statement where there value actually matters then you need to be careful. To memorize the rules how ++i and i++ works you could think of it like this:

++i first increase then give you the value of i. As you first increased it is now i+1. 
i++ first gives you the value of i, which is still i and then increase.

PS: Afaik the technical term is side effects.


As said by using i++,++i, i=i+1 or i+=1 the value of i is changed from 0 to 1 and to show this i added a console.log(i) after the statement. The other thing important here is that the statement itself also has a statement which I tried to explain in the other post.


9 posts were split to a new topic: 12. Why is this an infinite loop?


Sorry to drag this up, but I'm really confused. Here is my code, that prints out "My name is undefined."

var names = ["Craig", "Amelia", "Alfred", "Stanley", "Willow"];
for (var i = 0; i < names.length; i++);
console.log ("I know someone called " + names[i] );

Your code was:

var names = ["Mark", "Betty", "Sam", "Ginger", "Hugh"];
for (var i = 0; i < names.length; i++) {
console.log("I know someone called " + names[i]);
And this works. I don't know what I've done wrong, I can't see it. I know there are braces around the console.log instruction in the working code, but that doesn't seem to make a difference.


As usual, I post then fix it. Dammit.

var names = ["Craig", "Amelia", "Alfred", "Stanley", "Willow"];
for (var i = 0; i < names.length; i++)
console.log("I know someone called " + names[i]);

Who knew spacing and semi-colons could cause so much strife?