覆盖 console.log(); 用于生产

IT技术 javascript debugging
2021-01-19 08:54:00

我对 Javascript 开发还很陌生,所以这可能是一个真正的新手问题。

我有一个 应用程序充满console.log();了调试目的。

我有 结合我所有的构建时间。它输出一个app.debug.js用于调试以及app.min.js用于生产

现在console.log();,当我准备好投入生产时,我可以查看我的所有代码文件并手动删除它,但我想知道是否有一种方法可以覆盖该方法。

基本上,无论何时console.log();调用方法,什么都不做。

这样,我可以将覆盖代码文件放在我的生产配置中,而不是我的调试配置中。

这可能吗?

6个回答

把它放在文件的顶部:

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

对于某些浏览器和缩小器,您可能需要将其应用到 window 对象上。

window.console = console;
@Flambino,我以前从未使用console.info过。看看他们每个人的输出,他们“似乎”是一样的......你会说log之间的区别是info什么?
2021-03-20 08:54:00
FWIW,控制台原型上还有很多其他功能,尽管其中许多很少使用。如铬38: ,assertclearconstructorcountdebugdirdirxmlerrorgroupgroupCollapsedgroupEndinfologmarkTimelineprofileprofileEndtabletimetimeEndtimeStamptimelinetimelineEndtracewarn
2021-03-25 08:54:00
我在下面的回答解决了核对整个控制台对象而不是覆盖每个方法的问题。它也很灵活,因为它实际上并不知道可用的方法。它只是替换了控制台对象上的所有方法。这是未来的证明。
2021-03-30 08:54:00
尽管这是一个投票率很高的答案,但我不推荐它,它会覆盖整个控制台对象,而不是仅覆盖日志功能。
2021-04-02 08:54:00
不要忘了覆盖console.infoconsole.warn并且console.error也一样,如果你使用这些
2021-04-06 08:54:00

或者,如果您只想重新定义控制台的行为(例如为了添加日志),您可以执行以下操作:

// define a new console
var console=(function(oldCons){
    return {
        log: function(text){
            oldCons.log(text);
            // Your code
        },
        info: function (text) {
            oldCons.info(text);
            // Your code
        },
        warn: function (text) {
            oldCons.warn(text);
            // Your code
        },
        error: function (text) {
            oldCons.error(text);
            // Your code
        }
    };
}(window.console));

//Then redefine the old console
window.console = console;
非常好...因为这些控制台方法接受多个参数,以增加一点额外的复杂性为代价,我们可以通过调用来支持它 oldCons.log.apply(arguments)
2021-03-15 08:54:00
@python1981,或者我们可以使用 ES6 扩展运算符。
2021-03-23 08:54:00

能够在生产版本中切换日志记录将非常有用。下面的代码默认关闭记录器。

当我需要查看日志时,我只需debug(true)在控制台中输入即可。

var consoleHolder = console;
function debug(bool){
    if(!bool){
        consoleHolder = console;
        console = {};
        Object.keys(consoleHolder).forEach(function(key){
            console[key] = function(){};
        })
    }else{
        console = consoleHolder;
    }
}
debug(false);

彻底地说,这会覆盖所有控制台方法,而不仅仅是console.log.

工作墨水很好,但删除行 consoleHolder = console; 当 bool = false 在线时。4. 因为这行在连续调用 debug(false) 两次时禁用了这个功能。如果我们已经调用了 debug(false);debug(false); 我们就不能再调用 debug(true); 意味着两次
2021-04-07 08:54:00

我使用的东西类似于 posit labs 所做的。将控制台保存在一个闭包中,您就可以在一个便携式功能中拥有它。

var GlobalDebug = (function () {
    var savedConsole = console;
    return function(debugOn,suppressAll){
        var suppress = suppressAll || false;
        if (debugOn === false) {
            console = {};
            console.log = function () { };
            if(suppress) {
                console.info = function () { };
                console.warn = function () { };
                console.error = function () { };
            } else {
                console.info = savedConsole.info;
                console.warn = savedConsole.warn;
                console.error = savedConsole.error;              
            }
        } else {
            console = savedConsole;
        }
    }
})();

只需执行 globalDebug(false) 以关闭日志消息或执行 globalDebug(false,true) 以删除所有控制台消息。

正是我正在寻找的,不仅要禁用日志,还要从浏览器本身启用它。
2021-03-24 08:54:00
完美地工作!
2021-04-11 08:54:00
console.log = function(){};

像其他任何事情一样覆盖它。

-1. 不要这样做!此处的行将对象不存在的浏览器上抛出 aReferenceError并保留console.logundefined console,这对于至少某些版本的 IE 来说是一个问题。如果您的目标是使您的 Web 应用程序做好生产准备,例如 OP,那么这几乎不是您需要的解决方案。而是按照尼尔写的去做。
2021-03-28 08:54:00
@MarkAmery 你是对的。我采用了“覆盖”的字面意思,就像“替换”一样,所以我当然假设存在原始版本。
2021-04-06 08:54:00