【译】你不知道的 Chrome 调试工具技巧 第十七天:再会console

3,207

特别声明

本文是作者 Tomek Sułkowski 发布在 medium 上的一个系列。据作者透露一共有 24 篇,一直更新到 12 月 24 日
版权归原作者所有。

作者在 Twitter 上推荐我们的中文翻译啦,截图在最后

译者在翻译前已经和作者沟通得到了翻译整个系列的授权。
为了不影响大家阅读,授权的记录在这里

正文

在马上就要迎来假期的这 24 天里,我将会发布一系列短篇的文章,关于如何更加有意思的使用开发工具,昨天昨天我们已经介绍了 DOMAjax 断点。今天,让我们回到 console 来开始这一周!

48. For more readable logs (更易读的日志)

即使 console.log 一个简单变量,你都可能会忘记(或混淆)哪一个是那个。当你有不同的变量需要打印的时候,阅读起来会更费劲。

“嗯?哪一个值对应哪一个变量来着?”

为了让它变得更加易读,你可以打印一个对象 - 只需将所有console.log 的参数包装在大括号中。感谢 ECMAScript 2015 中引入了 enhanced object literal(增强对象文字面量) ,所以这(加了个括号)就是你需要做的全部了:

针对这个 tip的感谢 : 我最开始是从wesbos 的文章里看到这个不可思议的新玩法的

不能再比这更清楚了! 或者它可以......?

49. Brackets + table = 🤯 (大括号 + 表格 = 🤯 )

还记得我们这系列第三天console.table tip 吗? 把那也加进来吧!

终极 log.

今天的分享就到这里~

惯例: 如果你从这里学到了一些新东西

→ 你可以点个赞再走嘛~
→ 关注我:Twitter:Tomek Sułkowski

其他系列

其他此系列的文章,马上就会翻译出来,到时会贴出对应的链接在此处。

写在最后

如果你对我的翻译表示肯定,也可以关注我一波哦~ 顺便我的开源项目,求一波 star→ 看这里, 美丽的博客系统

作者在 Twitter 上推荐我们的中文翻译啦