为什么需要控制台输出格式化
写代码时，打印日志是最常见的调试手段。但当你在控制台看到一连串密密麻麻的 console.log 输出时，是不是经常眼花缭乱？尤其是对象、数组混在一起，时间久了自己都看不懂哪条是哪个变量。
这时候，简单的换行和颜色区分就能省下不少排查时间。控制台输出格式化不是炫技，而是提升开发效率的实际需求。
基础技巧：合理使用占位符
JavaScript 的 console.log 支持格式化字符串，类似 C 语言的 printf。用 % 可以插入不同类型的数据：
console.log('用户：%s，年龄：%d，是否登录：%o', '张三', 28, { loggedIn: true });其中 %s 代表字符串，%d 是数字，%o 是对象。浏览器会自动替换并高亮显示对象结构，比直接拼接字符串清晰多了。
用样式让输出更醒目
Chrome 和 Edge 支持 console.log 中使用 %c 添加 CSS 样式。比如你想把某个关键日志标红加粗：
console.log('%c警告：数据加载失败！', 'color: white; background: red; padding: 2px 4px; font-weight: bold;');这样每次运行时，这条信息都会以醒目的方式出现在控制台，一眼就能注意到。
分组输出，结构更清晰
如果一段逻辑打印了十几条日志，可以使用 console.group 把它们折叠起来：
console.group('用户登录流程');
console.log('开始请求');
console.log('收到响应');
console.groupEnd();在控制台点击左侧的小箭头就能展开或收起，特别适合模块化调试。
表格化展示数据
当处理数组或对象列表时，console.table 能直接以表格形式呈现：
const users = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 }
];
console.table(users);比起展开一个个对象，表格一眼就能对比字段值，尤其适合查看数据列表是否正确生成。
实际场景：调试接口返回
假设你正在调一个用户信息接口，想确认返回数据结构和状态码。可以这样组织输出：
console.group('%c【API】获取用户信息', 'color: blue; font-weight: bold;');
console.log('请求参数：', { id: 123 });
console.log('响应状态：', response.status);
console.table(response.data);
console.groupEnd();这样一跑代码，整个调用过程清清楚楚，别人接手也能快速理解。
控制台不只是“能看就行”，花点时间格式化输出，长期来看能少掉很多头发。