如何通过浏览器控制台启用/禁用代码中的console.log？

1. 初始化全局控制对象 #

先在项目入口文件或最外层代码里创建全局的adysis对象，用来管理调试状态和控制方法：

window.adysis = window.adysis || {
  _debugEnabled: false, // *默认关闭调试日志*
  debug: function(action) {
    switch(action) {
      case 'enable':
        this._debugEnabled = true;
        console.log('调试日志已开启');
        break;
      case 'disable':
        this._debugEnabled = false;
        console.log('调试日志已关闭');
        break;
      default:
        console.warn('无效命令，请使用 "enable" 或 "disable"');
    }
  }
};

2. 替换原有日志语句 #

把你代码里所有直接调用的console.log，换成自定义的adysis.log方法——这个方法只会在调试模式开启时输出日志：

// 给adysis添加自定义日志方法
adysis.log = function(...args) {
  if (this._debugEnabled) {
    console.log(...args);
  }
};

// 替换示例
// 原来的代码：console.log('用户ID:', userId);
// 替换后：adysis.log('用户ID:', userId);

3. 控制台快速控制 #

现在打开浏览器控制台，输入以下命令就能随时切换日志状态：

• 开启日志：adysis.debug('enable')
• 关闭日志：adysis.debug('disable')

可选：无需替换原有代码的方案 #

如果不想逐个修改代码里的console.log，可以重写原生console.log（注意：这会影响页面上所有的console.log输出）：

// 先备份原生console.log
const originalConsoleLog = console.log;

// 重写console.log
console.log = function(...args) {
  if (window.adysis?._debugEnabled) {
    originalConsoleLog.apply(console, args);
  }
};

用这个方案的话，你不需要修改原有代码里的任何console.log，直接通过adysis.debug命令控制即可。

内容的提问来源于stack exchange，提问作者David Stanton