是否有任何方法关闭我的JavaScript代码中的所有console.log语句,用于测试目的?
当前回答
当使用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上编写测试代码
其他回答
在对这个问题做了一些研究和开发之后,我遇到了这个解决方案,它将根据您的选择隐藏警告/错误/日志。
(function () {
var origOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function () {
console.warn = function () { };
window['console']['warn'] = function () { };
this.addEventListener('load', function () {
console.warn('Something bad happened.');
window['console']['warn'] = function () { };
});
};
})();
将此代码添加到JQuery插件(例如/../ JQuery. min.js)之前,即使这是不需要JQuery的JavaScript代码。因为有些警告是JQuery本身的。
谢谢! !
console.log('pre');
/* pre content */
// define a new console
let preconsole = Object.assign({}, window.console);
let aftconsole = Object.assign({}, window.console, {
log: function(text){
preconsole.log(text);
preconsole.log('log');
}
});
console = aftconsole;
/* content */
console.log('content');
/* end of content */
console = preconsole;
console.log('aft');
你不应该!
重写内置函数不是一个好的做法。也不能保证你会抑制所有输出,你使用的其他库可能会与你的更改冲突,还有其他函数可能会写入控制台;.warning .dir (), (), . error (), .debug (), . assert()等。
正如一些人建议的那样,您可以定义一个DEBUG_MODE变量并有条件地记录日志。根据代码的复杂性和性质,编写自己的记录器对象/函数可能是一个好主意,它包装了控制台对象并内置了此功能。那将是处理仪器的正确地方。
也就是说,出于“测试”的目的,您可以编写测试,而不是打印到控制台。如果您不做任何测试,而那些console.log()行只是编写代码的辅助,那么只需删除它们。
如果你使用IE7,控制台将不会被定义。所以一个更IE友好的版本是:
if (typeof console == "undefined" || typeof console.log == "undefined")
{
var console = { log: function() {} };
}
嘿~让我们用现代的2022方式来做~
ES6中引入了代理和反射。这些是我们正在寻找的工具,使console.log被条件“禁用”。
在传统的方法中,你必须创建另一个函数,像这样:
let console_disabled = true;
function console_log() {
if (!console_disabled) {
console.log.apply(console, arguments); //Dev Tools will mark the coding line here
}
}
但是,这将创建另一个函数,并且您无法使用Dev Tools中显示的编码行记录消息。
这就是2022年之路。
// Disable Console Log without altering debug coding line. // No override original `console` object let console_disabled = false; const nullFunc = function(){}; const _console = new Proxy(console, { get(target, prop, receiver){ if(prop==='log' && console_disabled){ return nullFunc; } return Reflect.get(...arguments) } }); console_disabled = true; _console.log('you cannot see me'); console_disabled = false; _console.log('you can see me @ line 18'); console_disabled = true; _console.log('you cannot see me'); console_disabled = false; _console.log('you can see me @ line 22');
您还可以重写原来的控制台对象。
// Disable Console Log without altering debug coding line. // Override original `console` object let console_disabled = false; const nullFunc = function(){}; console = new Proxy(console, { get(target, prop, receiver){ if(prop==='log' && console_disabled){ return nullFunc; } return Reflect.get(...arguments) } }); console_disabled = true; console.log('you cannot see me'); console_disabled = false; console.log('you can see me @ line 18'); console_disabled = true; console.log('you cannot see me'); console_disabled = false; console.log('you can see me @ line 22');
有关代理和反射的详细信息, 请访问https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy
推荐文章
- 给一个数字加上st, nd, rd和th(序数)后缀
- 如何以编程方式触发引导模式?
- setTimeout带引号和不带括号的区别
- 在JS的Chrome CPU配置文件中,'self'和'total'之间的差异
- 用javascript检查输入字符串中是否包含数字
- 如何使用JavaScript分割逗号分隔字符串?
- 在Javascript中~~(“双波浪号”)做什么?
- 谷歌chrome扩展::console.log()从后台页面?
- 未捕获的SyntaxError:
- [].slice的解释。调用javascript?
- jQuery日期/时间选择器
- 我如何预填充一个jQuery Datepicker文本框与今天的日期?
- 数组的indexOf函数和findIndex函数的区别
- jQuery添加必要的输入字段
- Access-Control-Allow-Origin不允许Origin < Origin >