console.log() 有时看不到输出，主因包括：旧版IE（<10）不支持致报错；生产环境被UglifyJS等工具删除；iframe或Web Worker中console为独立实例；浏览器控制台过滤、扩展拦截、代码未执行或被重写。
console.log() 为什么有时看不到输出？
不是所有环境都支持 console.log()，比如旧版 IE（<10）直接报 console is not defined 错误；生产环境若用 UglifyJS 等压缩工具且未配置 drop_console: false，它会被整行删掉。
更隐蔽的问题是：在 iframe 或 Web Worker 中，console 是独立实例，主页面调用不会透出到父页 DevTools。
- 检查浏览器兼容性：Chrome/Firefox/Edge/Safari ≥ 8 均支持基础方法
- 避免未定义报错：可提前兜底
if (typeof console !== 'undefined' && console.log) { console.log(...); } - 不要依赖
console.log()做关键流程日志——它不保证执行顺序（尤其混用异步操作时），也不受 try/catch 捕获
console.warn() 和 console.error() 的实际区别在哪？
视觉上 console.warn() 显示黄色三角，console.error() 是红色叉，但关键差异在行为：
console.error()触发时，DevTools 默认高亮并暂停（如果启用了「Pause on caught exceptions」或「Break on error」相关选项）多数浏览器对
console.error()会额外记录堆栈（即使没抛异常），而console.warn()通常只记调用点-
在 Chrome 的 Network 标签下，
console.error()可能关联 failed 请求（比如 fetch 报错后手动 log），但console.warn()不会立即学习“前端免费学习笔记（深入）”；
用
console.error()标记必须人工介入的问题（如 API 返回 500 后的 fallback 失败）别用
console.warn()替代类型检查——它不会中断执行，容易被忽略
console.table() 什么情况下反而让调试更难？
console.table() 对数组或对象键值结构清晰的数据很友好，但有明显局限：
只显示第一层属性（或数组元素），嵌套对象一律显示为
[object Object]，无法展开不支持 Set、Map、Date、RegExp 等原生对象，会转成空对象或字符串（如
new Date()显示为"2024-06-12T08:23:45.123Z"，但丢失原型信息）表格列数上限约 100，超长 key 名会被截断，且排序按字母序而非声明顺序
调试深层嵌套数据时，优先用
console.log(JSON.stringify(obj, null, 2))或直接展开对象想看 Map 内容？先转成数组：
console.table([...myMap.entries()])注意：Vue/React 组件实例传给
console.table()几乎无用，因核心数据藏在$data或state里
console.group() 和 console.time() 这类辅助方法怎么避免干扰主线程？
console.group()、console.time()、console.count() 看似轻量，但在高频循环中可能拖慢性能：
console.time()的计时精度依赖performance.now()，但每次调用仍需 DevTools 进程通信，大量使用（如每帧调用）会导致主线程卡顿console.group()嵌套过深（>20 层）时，Chrome 会自动折叠，Firefox 则可能崩溃渲染面板console.count()本质是全局计数器，同名 label 共享状态，跨模块易冲突（比如两个组件都用console.count('render')）时间测量仅用于粗略定位瓶颈，真要压测请用
performance.mark()+performance.measure()分组调试后务必配对
console.groupEnd()，否则后续所有 log 都被收进该组（极难排查）生产构建时，建议用 webpack DefinePlugin 将
console.*全局替换为空函数，比靠压缩工具更可控
复杂调试往往不是方法不够多，而是没意识到 console 本身也是运行时的一部分——它会参与事件循环、占用内存、触发跨进程通信。真正需要关注的，是哪些 log 必须存在，哪些只是临时拐杖。
