【譯】你不知道的 Chrome 除錯工具技巧 第十七天:再會console

dendoink發表於2018-12-20

特別宣告

本文是作者 Tomek Sułkowski 釋出在 medium 上的一個系列。據作者透露一共有 24 篇,一直更新到 12 月 24 日
版權歸原作者所有。

作者在 Twitter 上推薦我們的中文翻譯啦,截圖在最後

譯者在翻譯前已經和作者溝通得到了翻譯整個系列的授權。
為了不影響大家閱讀,授權的記錄在這裡

正文

在馬上就要迎來假期的這 24 天裡,我將會發布一系列短篇的文章,關於如何更加有意思的使用開發工具,昨天昨天我們已經介紹了 DOMAjax 斷點。今天,讓我們回到 console 來開始這一週!

48. For more readable logs (更易讀的日誌)

即使 console.log 一個簡單變數,你都可能會忘記(或混淆)哪一個是那個。當你有不同的變數需要列印的時候,閱讀起來會更費勁。

【譯】你不知道的 Chrome 除錯工具技巧 第十七天:再會console

“嗯?哪一個值對應哪一個變數來著?”

為了讓它變得更加易讀,你可以列印一個物件 - 只需將所有console.log 的引數包裝在大括號中。感謝 ECMAScript 2015 中引入了 enhanced object literal(增強物件文字面量) ,所以這(加了個括號)就是你需要做的全部了:

【譯】你不知道的 Chrome 除錯工具技巧 第十七天:再會console

針對這個 tip的感謝 : 我最開始是從wesbos 的文章裡看到這個不可思議的新玩法的

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

49. Brackets + table = ? (大括號 + 表格 = ? )

還記得我們這系列第三天console.table tip 嗎? 把那也加進來吧!

【譯】你不知道的 Chrome 除錯工具技巧 第十七天:再會console

終極 log.

今天的分享就到這裡~

慣例: 如果你從這裡學到了一些新東西

→ 你可以點個贊再走嘛~
→ 關注我:Twitter:Tomek Sułkowski

其他系列

其他此係列的文章,馬上就會翻譯出來,到時會貼出對應的連結在此處。

寫在最後

如果你對我的翻譯表示肯定,也可以關注我一波哦~ 順便我的開源專案,求一波 star→ 看這裡, 美麗的部落格系統

作者在 Twitter 上推薦我們的中文翻譯啦

【譯】你不知道的 Chrome 除錯工具技巧 第十七天:再會console

相關文章