离开“console.log()”是个坏主意。 在您的生产 JavaScript 代码中调用？

Question

我的 JavaScript 中有一堆 console.log() 调用。

我应该在部署到生产环境之前将它们注释掉吗？

我想将它们留在那里，这样如果我需要进行更多调试，就不必再费力地重新添加注释。 这是一个坏主意吗？

Answer 1

它将导致 Javascript 错误，终止包含错误的 Javascript 块的执行。

但是，您可以定义一个虚拟函数，当 Firebug 未处于活动状态时，该函数不执行任何操作：

if(typeof console === "undefined") {
    console = { log: function() { } };
}

如果您使用 log 以外的任何方法，则还需要将这些方法存根掉。

Answer 2

正如其他人已经指出的那样，保留它会在某些浏览器中导致错误，但可以通过放置一些存根来解决这些错误。

然而，我不仅会注释掉它们，还会彻底删除这些行。 否则的话，似乎就显得草率了。 也许我很迂腐，但我认为“生产”代码根本不应该包含“调试”代码，即使是以注释的形式也是如此。 如果您留下注释，这些注释应该描述代码正在做什么，或者其背后的推理，而不是禁用的代码块。 （尽管，大多数注释应该通过你的缩小过程自动删除。你正在最小化，对吧？）

此外，在使用 JavaScript 的几年中，我不记得曾经回到过一个函数并说“哎呀，我希望我已将这些 console.logs 留在此处！” 一般来说，当我“完成”某个功能的工作并且稍后必须返回时，我会回来解决其他一些问题。 无论新问题是什么，如果上一轮工作的 console.logs 可能有帮助，那么我就会第一时间发现问题。 换句话说，如果我回到某些事情，我不太可能需要与以前所需的完全相同的调试信息。

只是我的两分钱...祝你好运！

---

13年后更新

我改变了主意，现在同意多年来对此答案积累的评论。

一些日志消息为应用程序（甚至是客户端 JavaScript 应用程序）提供长期价值，应该保留。

其他日志消息是低价值噪音，应该删除，否则它们会淹没高价值消息。

Answer 3

如果您有部署脚本，则可以使用它来删除对 console.log 的调用（并缩小文件）。

当您这样做时，您可以通过 JSLint 抛出您的 JS 并记录违规情况以供检查（或阻止部署）。

这是一个很好的例子，说明了为什么您想要自动化部署。 如果您的流程允许您发布其中包含 console.logs 的 js 文件，那么在某些时候您会这样做。

Answer 4

据我所知，没有比以下 45 个字符更短的存根 console.log 方法了：

window.console||(console={log:function(){}});

这是 3 个不同版本中的第一个，具体取决于您想要存根的控制台方法，所有这些方法都很小，而且所有这些都已在 IE6+ 和现代浏览器中进行了测试。

其他两个版本涵盖了不同的其他控制台方法。 一个涵盖了四个基础知识，另一个涵盖了所有已知的 firebug 和 webkit 控制台方法。 同样，文件大小尽可能小。

该项目位于 github 上： https://github.com/andyet/ConsoleDummy.js

如果您可以想出任何方法来进一步减少代码，欢迎贡献。

-- 编辑 -- 2012 年 5 月 16 日

我已经改进了这段代码。 它仍然很小，但增加了打开和关闭控制台输出的功能： https://github.com/HenrikJoreteg/andlog

这是精选于变更日志显示

Answer 5

如果该对象不存在，您至少应该创建一个虚拟 console.log ，这样您的代码就不会在未安装 Firebug 的用户计算机上引发错误。

另一种可能性是仅在“调试模式”下触发日志记录，即如果设置了某个标志：

if(_debug) console.log('foo');
_debug && console.log('foo');

Answer 6

希望它对某人有所帮助——我不久前为它编写了一个包装器，它比公认的解决方案稍微灵活一些。

显然，如果你使用其他方法，例如console.info等，你可以复制效果。 完成临时环境后，只需将默认的 C.debug 更改为 false 即可进行生产，您无需更改任何其他代码/取出行等。稍后很容易返回并进行调试。

var C = {
    // console wrapper
    debug: true, // global debug on|off
    quietDismiss: false, // may want to just drop, or alert instead
    log: function() {
        if (!C.debug) return false;

        if (typeof console == 'object' && typeof console.log != "undefined") {
            console.log.apply(this, arguments); 
        }
        else {
            if (!C.quietDismiss) {
                var result = "";
                for (var i = 0, l = arguments.length; i < l; i++)
                    result += arguments[i] + " ("+typeof arguments[i]+") ";

                alert(result);
            }
        }
    }
}; // end console wrapper.

// example data and object
var foo = "foo", bar = document.getElementById("divImage");
C.log(foo, bar);

// to surpress alerts on IE w/o a console:
C.quietDismiss = true;
C.log("this won't show if no console");

// to disable console completely everywhere:
C.debug = false;
C.log("this won't show ever");

Answer 7

这似乎对我有用......

if (!window.console) {
    window.console = {
        log: function () {},
        group: function () {},
        error: function () {},
        warn: function () {},
        groupEnd: function () {}
    };
}

Answer 8

我想我会分享不同的观点。 在 PCI 应用程序中让这种类型的输出对外界可见会使您不合规。

Answer 9

我同意控制台存根是一个好方法。 我尝试过各种控制台插件、代码片段，包括一些相当复杂的。 他们都在至少一个浏览器中遇到了一些问题，所以我最终选择了如下所示的简单内容，它是我见过的其他片段和 YUI 团队的一些建议的合并。 它似乎可以在 IE8+、Firefox、Chrome 和 Safari（适用于 Windows）中运行。

// To disable logging when posting a production release, just change this to false.
var debugMode = false;

// Support logging to console in all browsers even if the console is disabled. 
var log = function (msg) {
    debugMode && window.console && console.log ? console.log(msg) : null;
};

注意：它支持通过标志禁用到控制台的日志记录。 也许您也可以通过构建脚本自动执行此操作。 或者，您可以公开 UI 或其他一些机制来在运行时翻转此标志。 当然，您可以通过日志记录级别、基于日志阈值的 ajax 提交日志（例如，所有错误级别语句都传输到服务器进行存储等）来变得更加复杂。

许多有关日志记录的线程/问题似乎将日志语句视为调试代码，而不是代码检测。 因此希望删除日志语句。 当应用程序处于野外状态并且不再那么容易附加调试器或从用户或通过支持向您提供信息时，仪表化非常有用。 您永远不应该记录任何敏感内容，无论其记录在何处，因此隐私/安全不应受到损害。 一旦您将日志记录视为工具，它现在就变成了生产代码，并且应该按照相同的标准编写。

对于使用越来越复杂的 javascript 的应用程序，我认为检测至关重要。

Answer 10

正如其他人提到的，它会在大多数浏览器中引发错误。 在 Firefox 4 中，它不会抛出错误，该消息会记录在 Web 开发人员控制台中（Firefox 4 中的新增功能）。

我非常喜欢的一种针对此类错误的解决方法是 de&&bug：

var de = true;
var bug = function() { console.log.apply(this, arguments); }

// within code
de&&bug(someObject);

Answer 11

一句漂亮的话：

(!console) ? console.log=function(){} : console.log('Logging is supported.');

Answer 12

是的，让它们始终在生产环境中运行是个坏主意。
您可以做的是使用console.debug，它仅在打开调试器时进行控制台。

https://developer.mozilla.org/en-US/文档/Web/API/控制台/调试