是否有任何方法关闭我的JavaScript代码中的所有console.log语句,用于测试目的?


当前回答

在其他答案的基础上,我个人希望只关闭代码的特定部分(ES6模块,但简单的单独脚本也可以)。


// old console to restore functionality
const consoleHolder = window.console;

// arbitrary strings, for which the console stays on (files which you aim to debug)
const debuggedHandlers = ["someScript", "anotherScript"];

// get console methods and create a dummy with all of them empty
const consoleMethodKeys = Object.getOwnPropertyNames(window.console).filter(item => typeof window.console[item] === 'function');
const consoleDummy = {};
consoleMethodKeys.forEach(method => consoleDummy[method] = () => {});

export function enableConsoleRedirect(handler) {
  if (!debuggedHandlers.includes(handler)) {
    window.console = consoleDummy;
  }
}

export function disableConsoleRedirect() {
  window.console = consoleHolder;
}

然后,只需将这个模块导入到您希望能够切换调试模式的任何文件中,在文件顶部调用enable函数,在底部调用disable函数。

如果希望在简单脚本中使用它,可能需要将顶部包装在匿名函数中和/或稍微重新组织它,以最大限度地减少名称空间污染。

此外,你可能想要只使用true/false而不是字符串处理程序,并在当前使用的文件中切换调试模式。

其他回答

当使用React时,你可以利用钩子来管理它,这样它就被限制在你的组件范围内

import { useEffect, useRef } from "react";

type LoggingReplacements = {
  debug?: typeof console["debug"];
  error?: typeof console["error"];
  info?: typeof console["info"];
  log?: typeof console["log"];
  warn?: typeof console["warn"];
};
/**
 * This replaces console.XXX loggers with custom implementations.  It will restore console log on unmount of the component.
 * @param replacements a map of replacement loggers.  They're all optional and only the functions defined will be replaced.
 */
export function useReplaceLogging({
  debug,
  error,
  info,
  log,
  warn,
}: LoggingReplacements): void {
  const originalConsoleDebug = useRef(console.debug);
  const originalConsoleError = useRef(console.error);
  const originalConsoleInfo = useRef(console.info);
  const originalConsoleLog = useRef(console.log);
  const originalConsoleWarn = useRef(console.warn);
  if (debug) {
    console.debug = debug;
  }
  if (error) {
    console.error = error;
  }
  if (info) {
    console.info = info;
  }
  if (log) {
    console.log = log;
  }
  if (warn) {
    console.warn = warn;
  }
  useEffect(() => {
    return function restoreConsoleLog() {
      console.debug = originalConsoleDebug.current;
      console.error = originalConsoleError.current;
      console.info = originalConsoleInfo.current;
      console.log = originalConsoleLog.current;
      console.warn = originalConsoleWarn.current;
    };
  }, []);
}

在https://github.com/trajano/react-hooks/tree/master/src/useReplaceLogging上编写测试代码

https://stackoverflow.com/a/46189791/871166的简化

switch (process.env.LOG_LEVEL) {
  case 'ERROR':
    console.warn = function() {};
  case 'WARN':
    console.info = function() {};
  case 'INFO':
    console.log = function() {};
  case 'LOG':
    console.debug = function() {};
    console.dir = function() {};
}

在脚本中重新定义console.log函数。

console.log = function() {}

够了,不再给控制台发消息了。

编辑:

扩展了Cide的想法。一个自定义记录器,您可以使用它从代码中切换登录。

从我的Firefox控制台:

var logger = function()
{
    var oldConsoleLog = null;
    var pub = {};

    pub.enableLogger =  function enableLogger() 
                        {
                            if(oldConsoleLog == null)
                                return;

                            window['console']['log'] = oldConsoleLog;
                        };

    pub.disableLogger = function disableLogger()
                        {
                            oldConsoleLog = console.log;
                            window['console']['log'] = function() {};
                        };

    return pub;
}();

$(document).ready(
    function()
    {
        console.log('hello');

        logger.disableLogger();
        console.log('hi', 'hiya');
        console.log('this wont show up in console');

        logger.enableLogger();
        console.log('This will show up!');
    }
 );

如何使用上面的“记录器”?在就绪事件中,调用记录器。disableLogger使控制台消息不被记录。向记录器添加调用。enabllogger和logger。在希望将消息记录到控制台的方法中的disableLogger。

我知道你问如何禁用console.log,但这可能是你真正想要的。这样就不必显式地启用或禁用控制台。它只是为那些没有打开或安装它的人防止那些讨厌的控制台错误。

if(typeof(console) === 'undefined') {
    var console = {};
    console.log = console.error = console.info = console.debug = console.warn = console.trace = console.dir = console.dirxml = console.group = console.groupEnd = console.time = console.timeEnd = console.assert = console.profile = function() {};
}

我的全面解决方案禁用/覆盖所有控制台。*函数在这里。

当然,请确保在检查必要的上下文之后包含它。例如,只包含在产品版本中,它不会轰炸任何其他关键组件等。

这里引用一下:

“使用严格的”; (() => { Var控制台=(窗口。控制台=窗口。控制台|| {}); [ “维护”、“清楚”、“数”、“调试”,“dir”、“dirxml”, "error", "exception", "group", " groupcollapse ", "groupEnd", "info", "log", "markTimeline", "profile", "profileEnd", "table", "time" "timeEnd" "timeStamp" "trace" "warn" ]。forEach(方法=> { Console [method] = () => {}; }); console.log("此消息不应该在控制台日志中可见"); })();