Why does JavaScript behave this way?

Question

Is the var highScore = 0 apart of the loop? Isn't scores[i] always greater than 0? I need someone to break down how the if statement is working, and I need to understand how highScore = scores[i] is giving me back the highest number. This exercise was in a book I'm reading to learn JavaScript, and I just feel it's way over my head. Can anyone shed light? Thank you.

How is the if statement working in this code? How is highScore even relevant as a variable to be used in the if statement, if it's value is 0? It doesn't seem logical for it to suddenly output the value is the highest number in the array.

var scores = [60, 50, 60, 58, 54, 54, 58, 50, 52, 54, 48, 69, 34, 55, 51, 52, 44, 51, 69, 64, 66, 55, 52, 61, 46, 31, 57, 52, 44, 18, 41, 53, 55, 61, 51, 44];

var highScore = 0;

for (i = 0; i < scores.length; i++) {

    output = "Bubble #: " + i + " scores: " + scores[i];

    console.log(output);

    if (scores[i] > highScore){
        var highScore = scores[i];
    }
}

Hint: what are you declaring two variables called `highScore`?? — Stephen C, Dec 21 '17 at 07:50

score 2 · Answer 1 · answered Dec 21 '17 at 07:49

2

The problem lies here:

    if (scores[i] > highScore){
    **var highScore = scores[i];**
}

You should simply change that to:

    if (scores[i] > highScore){
        highScore = scores[i];
}

Everything should work perfectly.

answered Dec 21 '17 at 07:49

Nimrod P.

150
5

Without doing this changes also it will work. – Suresh Ponnukalai Dec 21 '17 at 08:10
@SureshPonnukalai given your answer – Sandeep Ranjan Dec 21 '17 at 08:13
i have given my answer already. @Nimrod mentioned that the problem is because of the line `var highScore=score[i];`. That is wrong. – Suresh Ponnukalai Dec 21 '17 at 08:14

score 2 · Answer 2 · answered Dec 21 '17 at 07:49

2

var highScore you are initialising again inside

if (scores[i] > highScore){
    var highScore = scores[i];
}

Remove var it will add to global highScore

answered Dec 21 '17 at 07:49

Durga

15,263
2
28
52

so you are trying to say the current code won't add it to global scope??? – Suresh Ponnukalai Dec 21 '17 at 08:13
2

@Suresh It will not, you are creating a new variable inside another scope and it's never reassigned. – cbll Dec 21 '17 at 08:14
It will never reassigned that i know. But what i am trying to say is it will overwrite the current one if you create with the same name. – Suresh Ponnukalai Dec 21 '17 at 08:17

score 2 · Answer 3 · answered Dec 21 '17 at 07:51

2

if (scores[i] > highScore){
    var highScore = scores[i];
}

If the scores i'th index is more than highScore(which starts are 0), highScore is then reassigned to that value.

So essentially, assuming the first index of the array is higher than 0, which is is since it's 60 - that's the new highscore.

Then, at index 1 which is 50, this is ran again:

if (scores[i] > highScore){
    var highScore = scores[i];
}

Is 50 higher than 60? No, hence, highScore remains at value 60. And so forth.

Edit:

However your code is wrong, you are creating a new variable highScore in the scope. You need to reassign your initial variable.

Hence,

highScore = scores[i];

answered Dec 21 '17 at 07:51

cbll

6,499
26
74
117

Wow, that just flew totally over my head, as a newbie to JavaScript, I spent nearly 2 hours trying to figure this out. Thank you for the explanation, that was very difficult for me. Do you have any suggestions on how I can learn better? – tkss44 Dec 21 '17 at 07:58
You need to initialize `i` as well. So, `var i = 0;`, apart from that it should be ok :) – cbll Dec 21 '17 at 07:59
It just seems like so much is happening in that if statement. Kind of boggles my mind – tkss44 Dec 21 '17 at 08:01
Baby steps. Seems like a lot now, in some time you'll find it to be childsplay :) – cbll Dec 21 '17 at 08:09

score 2 · Answer 4 · answered Dec 21 '17 at 08:05

I think you are getting confused on the scope of the variable. If you declare your variable with the keyword var in your program anywhere it will treat as global scope. It means you can access the updated values in anywhere of your program. Thats why it is giving the highest number as a output after the for loop execute. Your code will work fine because of this reason.DEMO HERE. You can see the output 69 as alert. Suppose in your code if you change the code from

   if (scores[i] > highScore){
    var highScore = scores[i];
   }

to

   if (scores[i] > highScore){
    let highScore = scores[i];
   }

Now you won't get the biggest number and it will alert the value 0, because the variable highScore declared as let and it will treat as a block level scope not a global scope. DEMO HERE. So when you put alert outside of the for loop it is getting the value from global scope highScore varibale.

I hope now you can easily understand how the if condition is working.

The explanation i have given related to scope. Because the code already working as he expected. — Suresh Ponnukalai, Dec 21 '17 at 10:40

score 1 · Answer 5 · answered Dec 21 '17 at 08:14

Javascript works perfectly fine. You have initialized highScore twice.

This is simple scoping of the variables.

var highScore = 0; 

    for (i = 0; i < scores.length; i++) {

        output = "Bubble #: " + i + " scores: " + scores[i];

        console.log(output);

        if (scores[i] > highScore){
            var highScore = scores[i]; // ---- (2)
        }
    }

When you use var for a declaration of variables it will become a global variable that is the reason you are getting the highest value of the array.

Try using let(in place of two) which has block scoping

Hope this helps

if you use let you won't get the highest no of the array – Sandeep Ranjan Dec 21 '17 at 08:15 — Sandeep Ranjan, Dec 21 '17 at 08:15

Why does JavaScript behave this way?

5 Answers5