console.log（）不适用于所有浏览器

Question

我最近遇到了一个奇怪的问题，console.log在我的代码中使用时不会输出任何内容，但可以在控制台中直接使用或使用window.console.log。

window.console.log(console);
window.console.log(window.console);
console.log("test1"); // (won't work)
window.console.log("test2");

输出继电器：

如果我在代码之前自己定义控制台：

var console = window.console;
window.console.log(console);
window.console.log(window.console);
console.log("test1");
window.console.log("test2");

输出继电器：

最奇怪的是，如果我在代码

之后自己定义控制台

window.console.log(console);
window.console.log(window.console);
console.log("test1");
window.console.log("test2");
var console = window.console;

输出继电器：

回答之前请注意：

1. 这不是特定于浏览器的问题，因为每个浏览器的输出都相同（我已经检查过chrome / firefox / safari / opera）。

2. 由于console＆amp;的记录，它没有被覆盖window.console返回相同的确切对象（请参见屏幕截图）。

Answer 1

这是JavaScript的一个惊人功能。 var指令在预执行阶段处理。所以这段代码：

function foo() {
    window.console.log(console);
    var console = window.console;
    window.console.log(console);
}

相当于：

function foo() {
    var console;
    window.console.log(console); // console is local variable and undefined
    console = window.console;
    window.console.log(console);
}

Answer 2

我找到了原因..在我们的grunt uglify函数（grunt-contrib-uglify）中，我们使用drop_console选项进行压缩：

uglify: {
    options: {
      compress: {
          drop_console: true
      }
    }, 
// ...

这显然会降低console的任何外观，但奇怪的是不会丢弃window.console。