在日常的前端開發中，我會經常使用 Chrome 開發者工具調節樣式、檢視日誌、追蹤錯誤。這給我的開發工作帶來了很大的便利。
在 Chrome 控制檯中，就有兩個非常方便且鮮為人知的騷操作，可以供我們使用：一個是可以在控制檯裡直接使用 await 關鍵字；另一個就是可以使用 $ 和 $$ 查詢元素。
await
await 是 ES2017 引入非同步函式這個特性時增加的一個關鍵字，除此之外還增加了一個 async。用 async 關鍵字修飾的函式稱為非同步函式，而 await 只能在非同步函式中使用。
雖然使用非同步函式能讓我們寫出比 Promise API 更加簡潔的程式碼，但由於“await 只能在非同步函式中使用”這個限制，在指令碼中直接使用 await 關鍵字是會報錯的。
根據錯誤提示，我們稍加修改，將 await 關鍵字包裝在非同步函式，就 OK 了。
而在 Chrome 控制檯中使用就沒有這樣的限制，我們可以直接使用 await：
$ 和 $$
document.querySelector 和 document.querySelectorAll 是兩個提供給我們查詢 DOM 元素的 API。Chrome 控制檯為它們起了別名：$ 和 $$。
使用 $：
使用 $$：
這裡需要注意的是，
$$的返回結果集並不是像使用document.querySelectorAll一樣返回一個NodeList，而是一個陣列。
參考連結
- TWO GOTCHAS IN CHROME DEVELOPER TOOL CONSOLE, by Sung M. Kim.
- Console Utilities API Reference, by Kayce Basques.
貢獻指北
感謝你花費寶貴的時間閱讀這篇文章。
歡樂的時光總是短暫的，文章到此結束了 ?。如果你覺得我的這篇讓你的生活美好了一點點，歡迎鼓（diǎn）勵（zàn）?。如果能在文章下面留下你寶貴的評論或意見是再合適不過的了，因為研究證明，參與討論比單純閱讀更能讓人對知識印象深刻?。
（完）