控制台中的JavaScript while循环可打印更多结果 [英] JavaScript while loop in console prints extra results

问题描述

谁能解释为什么以下代码作为函数的一部分运行时能起作用，但在Chrome控制台窗口中单独运行时却产生奇怪的结果？

  var foo = function（）{
 var x = 1; 
而（x <3）{
 console.log（x）; 
 x = x + 1; 
} 
} 
 
 foo（）; //这会按预期打印1,2，
  

但是当我只运行 直接在Chrome控制台中得到1,2,3，这没有任何意义（请参见输出图像）：

  var y = 1; 
而（y <3）{
 console.log（y）; 
 y = y + 1; 
} 
 
 //在控制台中打印1,2,3 
  

注意关于 console.log 的问题类似，导致 undefined （ Chrome / Firefox console.log始终添加一行，表示未定义），但没有任何作用调用我的示例，而而则永远不会返回任何值。

解决方案

您被Chrome的JavaScript控制台所迷惑。

除了 console.log（）调用的输出之外，控制台还会显示在您运行的代码中执行的最后一个表达式的值。

在第一个示例中，最后一个表达式是 foo（）; 最后调用。 foo（）不返回任何值，因此结果为 undefined ，这是在<$ c之后打印的内容您的 console.log（y）调用打印的$ c> 1 和 2 。

在第二个示例中， console.log（）仍仅被调用两次，再次打印 1 和 2 。之后打印的 3 不是来自 console.log（）调用，它是最后执行的表达式的值，最后的 y = y + 1; 使得 y 最多达到 3 并导致 while 循环终止。

这里是另一个示例。将此代码粘贴到控制台中：

  var y = 1，message =’’; 
 while（y< 3）{
 console.log（y）; 
 y = y + 1; 
消息= y是 + y； 
} 
  

现在打印：

  1 
 2 
 y is 3 
  

1 和 2 再次来自 console.log（y）调用与以前一样。像其他示例一样，在代码运行完毕后，它会打印最后执行的表达式—但现在该表达式为： y是'+ y;

其中 y 再次为 3 结束。

或更简单的示例。在控制台中输入以下内容：

  console.log（嗨！）； 
  

打印：

 嗨！ 
未定义
  

Hi！是您的 console.log（）执行，而 undefined 是返回值 console.log（）调用。

另一个提示是最后一个值左侧的小符号在每个示例中打印到控制台。似乎该符号表示开发工具正在自动打印值，而不是通过 console.log（）调用来打印。

Can anyone explain why the following code works when run as part of function, but it produce strange result when run by itself in the Chrome Console window?

var foo = function() { 
    var x = 1;
    while (x<3) { 
        console.log(x);
        x = x+1;
    }
}

foo(); // This prints 1,2 as expected

But when I run just while part directly in Chrome Console I get 1,2,3 which makes no sense (see image for the output):

    var y = 1;
    while (y<3) { 
        console.log(y);
        y = y+1;
    }

    // This prints 1,2,3 in the console

Note that there somewhat similar question about console.log resulting in undefined (Chrome/Firefox console.log always appends a line saying undefined), but there is no function call in my sample and while does not ever return any value.

解决方案

You are being misled by Chrome's JavaScript console.

In addition to the output of console.log() calls, the console also displays the value of the last expression executed in the code you run there.

In your first example, the last expression is the foo(); call at the end. foo() doesn't return any value, so the result is undefined and that's what's printed after the 1 and 2 that your console.log(y) calls print.

In the second example, console.log() is still being called only twice, again printing 1 and 2. The 3 printed after that is not from a console.log() call, it's the value of the last expression executed, the final y = y + 1; that brings y up to 3 and causes the while loop to terminate.

Here's another example. Paste this code into the console:

var y = 1, message = '';
while( y < 3 ) { 
    console.log( y );
    y = y + 1;
    message = 'y is ' + y;
}

Now it prints:

1
2
"y is 3"

The 1 and 2 are again from the console.log(y) calls as before. Like the other examples, after the code finishes running it prints the last expression executed—but now that expression is:

message = 'y is ' + y;

where y is again 3 at the end.

Or a much simpler example. Enter this in the console:

console.log( 'Hi!' );

It prints:

Hi!
undefined

The Hi! is your console.log() executing, and the undefined is the return value of the console.log() call.

Another clue here is the little symbol to the left of the last value printed to the console in each of the examples. It looks like that symbol means that the dev tools are printing the value automatically instead of from a console.log() call.

这篇关于控制台中的JavaScript while循环可打印更多结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！