Special statement

This article is a series by Tomek Sułkowski published on Medium. According to the author revealed a total of 24 articles, updated until December 24, the copyright of the original author.

I have sent the translation links of the first two articles to the author himself. Although he does not understand Chinese, he is still very happy. The screenshots are at the end

The translator had already communicated with the author before the translation to get permission to translate the whole series. In order not to disturb your reading, the record of authorization is here

The body of the

In the 24 days leading up to the holiday season, I will be publishing a series of short articles on how to use development tools in a more interesting way. Yesterday we learned about Command Menu. Today we start at 21 and say:

21. Console is asynchronous

Today, more and more browser-related apis are based on Promise. When you use a promise you usually use.then(the handler) or wrap it (the promise) in an async method and use await to receive its result.

We use a lot of these things in JavaScript/TypeScript, but writing such structures in Console is not at all convenient.

It’s going to look something like this

Or it

Ugh, that’s terrible! I’ve failed to write this code twice, missed a parenthesis, or accidentally executed the code before I could finish typing.

But if theconsoleThe default isasyncThe parcel?

And guess what, it is! You can use awit directly:

It’s actually much easier to use Promise in Console than in the source code!

22. Use your asyncconsoleLet’s see something even cooler

I find the fetch example as boring as you do — here are some new ways to get more interesting information from your console:

  • StorageThe number of occupied and idle systems
await navigator.storage.estimate()
Copy the code

  • Battery information for your device

For better results, combine this tip with the console.table mentioned a few days ago:

Knock on the blackboard (underline) : This is an API that is not recommended, even though it looks cool…

  • The media ability

  • Cache storage keys

Cache storage keys are used to Cache request and response keys.

The list goes on and on. It’s definitely handy to be able to easily retrieve the promise package values on the Console.

That’s all for today’s sharing

Routine: If you learn something new from this

→ Follow me on Twitter: Tomek Sułkowski

Other series

Other articles in this series will be translated soon, with links posted here.

  • Day 1: ‘$’ in the Console
  • Tips you might not know about Chrome debugging tools Day 2: Copying & Saving
  • Chrome debugging tools you didn’t know about
  • The Chrome debugging tool has a few tricks you don’t know about.
  • Day 5: Console log, puzzling case
  • You don’t know the Command menu for Chrome
  • 7. Fun tips you didn’t know about the Chrome Debugging Tool Consle
  • Chrome’s Color picker is a Color picker that you don’t know about.
  • Day 9: Time console
  • Custom Formatters are custom formatters for Chrome.
  • Today: Style Editors continued
  • Tips you don’t know about the Chrome Debug Tool Day 12: Ninja Log Print! (the ninja logs)
  • Chrome debugging Tool tips you didn’t know about
  • Chrome Debugging Tool tips you didn’t know About day 14: Other shortcuts
  • Chrome debugger tips you didn’t know about
  • Tips you don’t know about Chrome debugging Tools 16: Breakpoints
  • Day 17: Farewell to Console
  • What you Didn’t know about Chrome Debug Tools
  • Chrome debug tool tips you don’t know
  • Tips you didn’t know about Chrome debugging tools Day 20: The dark arts of Workspace
  • Tips you Don’t Know about Chrome Debugging Tools Day 21: Snippets
  • Chrome Debugging Tool tips you didn’t know
  • Chrome debug Tool tips you don’t know
  • Day 24: The last day, New Year’s Day, is awesome

Write in the last

If you are sure of my translation, you can also pay attention to my wave oh ~ incidentally my open source project, for a wave of star→ see here, beautiful blog system

About this translation, the author’s reply