【譯】你不知道的Chrome調試工具技巧第七天：異步console的趣味小竅門

特別聲明

本文是做者 Tomek Sułkowski 發佈在 medium 上的一個系列。據做者透露一共有24篇，一直更新到12月24日
版權歸原做者全部。
javascript

前兩篇的翻譯連接我已經給到了做者本人，雖然他不理解中文，可是他仍是很開心哈哈,截圖在最後
vue

譯者在翻譯前已經和做者溝通獲得了翻譯整個系列的受權。
爲了避免影響你們閱讀，受權的記錄在這裏
java

在立刻就要迎來假期的這 24 天裏，我將會發布一系列短篇的文章，關於如何更加有意思的使用開發工具，昨天咱們瞭解了 Command Menu 咱們今天從 21 開始，說的是：git

現在，愈來愈多與瀏覽器有關的API都是 基於Promise的 。當你使用 promise 的時候你一般使用 .then(處理方法) 或者將它 ( promise ) 包裹在 async 方法中，而且使用 await 來接收它的結果。github

咱們在 JavaScript/TypeScript 中大量使用這些東西，可是在 Console 中書寫這樣的結構，一點都不方便。promise

就是像下面這樣瀏覽器

或者這樣緩存

額，太可怕了！我曾經在寫這段代碼時失敗了兩次，漏寫了一個括號，或者是在我完成輸入以前就意外的（觸發）執行了這段代碼。異步

但若是 console 默認就被 async 包裹呢？async

你猜怎麼着，真是這樣！你能夠直接使用 awit ：

事實上在 Console 中使用 promise 比在源碼中使用要簡單得多！

我和你同樣，都以爲 fetch 的例子至關無聊， -- 這兒有一些新玩法：經過你的 console 來獲取到更多有意思的信息:

await navigator.storage.estimate()
複製代碼

爲了效果更好，把這條 tip 和前幾天中提到的 console.table 合併使用：

敲黑板（劃重點）：這是一條不推薦使用的API ,儘管看起來這麼酷炫...

(譯者注：Cache storage keys 通常用來對 request 和 response 進行緩存)

更多的例子不勝枚舉。可以在 console 中輕鬆的獲取 promise 包裹的值絕對是至關方便的。

今天的分享就到這裏~

慣例：若是你從這裏學到了一些新東西

→ 你能夠點個贊再走嘛~
→ 關注我：Twitter：Tomek Sułkowski

其餘此係列的文章，立刻就會翻譯出來，到時會貼出對應的連接在此處。

若是你對個人翻譯表示確定，也能夠關注我一波哦~ 順便個人開源項目，求一波 star→ 看這裏, 美麗的博客系統