是否有任何方法关闭我的JavaScript代码中的所有console.log语句，用于测试目的?
当前回答
我在这个url中找到了一段更高级的代码。
var DEBUG_MODE = true; // Set this value to false for production
if(typeof(console) === 'undefined') {
console = {}
}
if(!DEBUG_MODE || typeof(console.log) === 'undefined') {
// FYI: Firebug might get cranky...
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() {};
}
其他回答
你可以使用javascript AOP(例如jquery-aop)来拦截所有对console.debug/log的调用，如果某个全局变量被设置为false，就不进行实际的调用。
您甚至可以(不时地)执行ajax调用，这样就可以更改服务器上启用/禁用日志的行为，当在登台环境或类似环境中遇到问题时启用调试，这可能非常有趣。
这是在JS 2020中引入的。在浏览器上globalThis和window一样，在nodejs上globalThis和global一样等等。在任何环境上，它将直接指向全局对象，因此这段代码将在任何支持JS2020的env上工作了解更多信息:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis
对于任何现代浏览器& nodejs v12或更新版本，你应该使用这个:
globalThis.console.log = () => null;
globalThis.console.warn = () => null;
globalThis.console.info = () => null;
globalThis.console.error = () => null;
这是我刚刚研究的一个相当详尽的解决方案。我介绍了https://developer.mozilla.org/en-US/docs/Web/API/console中所有完全支持的控制台方法
1. 创建js文件“logger.js”，并将以下代码放入其中
logger = {
assert: function() {
if(logger.active && logger.doAssert) {
console.assert.apply(null,arguments);
}
},
clear: function() {
if(logger.active && logger.doClear) {
console.clear();
}
},
count: function() {
if(logger.active && logger.doCount) {
console.count.apply(null,arguments);
}
},
countReset: function() {
if(logger.active && logger.doCountReset) {
console.countReset.apply(null,arguments);
}
},
debug: function() {
if(logger.active && logger.doDebug) {
console.debug.apply(null,arguments);
}
},
dir: function() {
if(logger.active && logger.doDir) {
console.dir.apply(null,arguments);
}
},
dirxml: function() {
if(logger.active && logger.doDirxml) {
console.dirxml.apply(null,arguments);
}
},
error: function() {
if(logger.active && logger.doError) {
console.error.apply(null,arguments);
}
},
group: function() {
if(logger.active && logger.doGroup) {
console.group.apply(null,arguments);
}
},
groupCollapsed: function() {
if(logger.active && logger.doGroup) {
console.groupCollapsed.apply(null,arguments);
}
},
groupEnd: function() {
if(logger.active && logger.doGroup) {
console.groupEnd.apply(null,arguments);
}
},
info: function() {
if(logger.active && logger.doInfo) {
console.info.apply(null,arguments);
}
},
log: function() {
if(logger.active && logger.doLog) {
console.log.apply(null,arguments);
}
},
table: function() {
if(logger.active && logger.doTable) {
console.table.apply(null,arguments);
}
},
time: function() {
if(logger.active && logger.doTime) {
console.time.apply(null,arguments);
}
},
timeEnd: function() {
if(logger.active && logger.doTime) {
console.timeEnd.apply(null,arguments);
}
},
timeLog: function() {
if(logger.active && logger.doTime) {
console.timeLog.apply(null,arguments);
}
},
trace: function() {
if(logger.active && logger.doTrace) {
console.trace.apply(null,arguments);
}
},
warn: function() {
if(logger.active && logger.doWarn) {
console.warn.apply(null,arguments);
}
},
active: true,
doAssert: true,
doClear: true,
doCount: true,
doCountReset: true,
doDebug: true,
doDir: true,
doDirxml: true,
doError: true,
doGroup: true,
doInfo: true,
doLog: true,
doTable: true,
doTime: true,
doTrace: true,
doWarn: true
};
2. 在所有脚本之前，在所有页面中都包含日志
3.将脚本中的所有“console.”替换为“logger.”
4. 使用
就像"console "一样，但是和"logger "连用
logger.clear();
logger.log("abc");
最后禁用部分或全部日志
//disable/enable all logs
logger.active = false; //disable
logger.active = true; //enable
//disable some logs
logger.doLog = false; //disable
logger.doInfo = false; //disable
logger.doLog = true; //enable
logger.doInfo = true; //enable
logger.doClear = false; //log clearing code will no longer clear the console.
EDIT
在我最近的项目中使用我的解决方案一段时间后，我意识到很难记住我应该使用logger。而不是主机。所以出于这个原因，我决定重写控制台。这是我的最新解决方案:
const consoleSubstitute = console;
console = {
assert: function() {
if(console.active && console.doAssert) {
consoleSubstitute.assert.apply(null,arguments);
}
},
clear: function() {
if(console.active && console.doClear) {
consoleSubstitute.clear();
}
},
count: function() {
if(console.active && console.doCount) {
consoleSubstitute.count.apply(null,arguments);
}
},
countReset: function() {
if(console.active && console.doCountReset) {
consoleSubstitute.countReset.apply(null,arguments);
}
},
debug: function() {
if(console.active && console.doDebug) {
consoleSubstitute.debug.apply(null,arguments);
}
},
dir: function() {
if(console.active && console.doDir) {
consoleSubstitute.dir.apply(null,arguments);
}
},
dirxml: function() {
if(console.active && console.doDirxml) {
consoleSubstitute.dirxml.apply(null,arguments);
}
},
error: function() {
if(console.active && console.doError) {
consoleSubstitute.error.apply(null,arguments);
}
},
group: function() {
if(console.active && console.doGroup) {
consoleSubstitute.group.apply(null,arguments);
}
},
groupCollapsed: function() {
if(console.active && console.doGroup) {
consoleSubstitute.groupCollapsed.apply(null,arguments);
}
},
groupEnd: function() {
if(console.active && console.doGroup) {
consoleSubstitute.groupEnd.apply(null,arguments);
}
},
info: function() {
if(console.active && console.doInfo) {
consoleSubstitute.info.apply(null,arguments);
}
},
log: function() {
if(console.active && console.doLog) {
if(console.doLogTrace) {
console.groupCollapsed(arguments);
consoleSubstitute.trace.apply(null,arguments);
console.groupEnd();
} else {
consoleSubstitute.log.apply(null,arguments);
}
}
},
table: function() {
if(console.active && console.doTable) {
consoleSubstitute.table.apply(null,arguments);
}
},
time: function() {
if(console.active && console.doTime) {
consoleSubstitute.time.apply(null,arguments);
}
},
timeEnd: function() {
if(console.active && console.doTime) {
consoleSubstitute.timeEnd.apply(null,arguments);
}
},
timeLog: function() {
if(console.active && console.doTime) {
consoleSubstitute.timeLog.apply(null,arguments);
}
},
trace: function() {
if(console.active && console.doTrace) {
consoleSubstitute.trace.apply(null,arguments);
}
},
warn: function() {
if(console.active && console.doWarn) {
consoleSubstitute.warn.apply(null,arguments);
}
},
active: true,
doAssert: true,
doClear: true,
doCount: true,
doCountReset: true,
doDebug: true,
doDir: true,
doDirxml: true,
doError: true,
doGroup: true,
doInfo: true,
doLog: true,
doLogTrace: false,
doTable: true,
doTime: true,
doTrace: true,
doWarn: true
};
现在你可以使用控制台。像往常一样。
在脚本中重新定义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。
当使用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上编写测试代码
