9

I have a simple question regarding while loop in Javascript. When I run this simple loop in browser console:

var count = 0;
while (count < 10) {
    console.log(count);
    count++;
}

The output to console log is 0,1,2...9. (as expected). However there is one more number which is returned to the console:

<- 9

Where does this return value come from?

I assume this is the return value of count++ expression. But why is the value not returned by every single loop?

Is it possible to somehow catch that returned value to a variable?

Giordano
  • 5,422
  • 3
  • 33
  • 49
sachad
  • 307
  • 4
  • 13
  • I am getting only 0-9 – PrakashSharma Feb 17 '16 at 10:42
  • 3
    @PrakashSharma Paste it straight into the console - the OP is talking about the [value displayed after running the code](http://imgur.com/TJxx2Vf). – James Thorpe Feb 17 '16 at 10:45
  • Please follow this link, it may help you. http://stackoverflow.com/questions/31434942/in-javascript-while-loop-repeats-last-number-when-counting-from-1-to-5-when-run?noredirect=1#comment59737852_31434942 – Sarge Mar 25 '16 at 08:07

3 Answers3

10

Read-eval-print-loops (REPLs) like browser consoles show the last result that the code generated. Somewhat surprisingly, JavaScript while loops and blocks have a result. For blocks, it's the result of the last statement in the block. For while statements, it's the result of the last iteration of the statement attached to the while (a block in your case).

Here's a simpler example with just a block:

{1 + 1; 3 + 3;}

In a REPL like the browser console, the above will show you 6, because it's a block containing two ExpressionStatements. The result of the first ExpressionStatement is 2 (that result is thrown away), and the result of the second one is 6, so the result of the block is 6. This is covered in the specification:

  1. Let blockValue be the result of evaluating StatementList.
  2. Set the running execution context’s LexicalEnvironment to oldEnv.
  3. Return blockValue.

while loop results are covered here.

Is it possible to somehow catch that returned value to a variable?

No, these results are not accessible in the code. E.g., you can't do var x = while (count < 10 { count++; }); or similar. You'd have to capture the result you want inside the loop/block/etc., assigning it to a variable or similar. Or (and I'm not suggesting this), use eval as Alin points out.

Community
  • 1
  • 1
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
3

When you run code directly in the browser console, it runs the code then logs the value of the last expression executed, in this case the value of count++, which at the final execution is 9 (it gets changed to 10 with the post-increment operator, ie after the value 9 is "read").

If you changed your code to:

var count = 0;
while (count < 10) {
  console.log(count);
  ++count;
}

It would instead log <- 10.

But why is the value not returned by every single loop?

Because it's not being returned at all, it's just the behaviour of the console.

Is it possible to somehow catch that returned value to a variable?

Yes, but you'll need to assign it:

var count = 0;
var lastcount;
while (count < 10) {
  console.log(count);
  lastcount = count++;
}

console.log(lastcount);

Note that if you run this snippet in the console, you'll get two 9s logged (one from the final loop, one from the extra console.log) followed by <- undefined, because the last console.log returns undefined.

James Thorpe
  • 31,411
  • 5
  • 72
  • 93
  • OK, got it now. The logged value after the loop is always the last executed expression. I was thinking if it has some connection to the while condition. But it has not. Basically whatever expression is last it goes to the console log. Thanks! – sachad Feb 17 '16 at 10:54
  • 1
    @sachad Check out the answer by T.J. Crowder - while mine is right in what it's recording, his is more technically accurate in how it's getting there (I learnt something new today!). – James Thorpe Feb 17 '16 at 10:58
  • @James Thorpe I don't think your answer is entirely accurate. There is actually a return value, and you can, sort of, catch it without assigning it. – Alin Purcaru Feb 17 '16 at 11:00
  • 1
    @AlinPurcaru: Only with `eval`, as you pointed out, which is really meta-programming. (But it's a good point.) – T.J. Crowder Feb 17 '16 at 11:04
1

I think the answer can be found in the behavior of eval:

eval() returns the value of the last expression evaluated.

What you throw in the console is most probably put through an eval() (or something similar). And the last evaluated expression, in your case count++ is returned and then logged to the console. (the value is 9, and not 10, because of post-incrementation).

I don't think you can store the result of the evaluation, unless you explicitly put it through another eval().

var x = eval("var count = 0;while (count < 10) {console.log(count);count++;};");

Or, in the Google Chrome console, you can use $_.

Alin Purcaru
  • 43,655
  • 12
  • 77
  • 90