JavaScript Console The console object provides access to the browser's debugging console (e.g., the web console in Firefox). The specifics of how it works vary from browser to browser, but there is a de facto set of features that are typically provided. Most developers usually use to debug JavaScript code but provides us with such a powerful set of features it would be a shame not to use them, or at least know what they do. console.log() console For general output of logging information. console.log() Informative logging of information. console.info() Outputs a warning message. console.warn() Outputs an error message to the Web console. console.error() Using other logging besides will provide you with more informative and clearer logs. console.log() Let’s start by exploring console object As we can see Console object has plenty of methods. Lets explore some of more useful ones. console.clear() The clear the console. console.clear() console.dir() prints the object in its string representation while recognizes the object as an object and prints it’s properties in the form of a clean expandable list. console.log() console.dir() const dog = {name: 'Rex', age: 7, friends: ['cat', 'dog', 'duck']}; console.dir(dog); console.table() With we can create beautiful tables. This is probably my favourite method. console.table() console console.time(), console.timeLog() and console.timeEnd() Use to start a timer. Use to print the time elapsed since the timer started. Use to print the total amount of time since started. console.time() console.timeLog() console.timeEnd() console.time() console.group() and console.groupEnd() The method creates a new inline group in the Web console log. This indents following console messages by an additional level until is called. console.group() console.groupEnd() console logging with CSS This works with most console methods such as , , etc. .log() .warn() .error() Please note that we have to use '%c' for css to work! console.log( "%cTheDailyTechTalk!", "color:red;font-family:system-ui;font-size:4rem;-webkit-text-stroke: 1px black;font-weight:bold" ); I recently started a new blog, TheDailyTechTalk, where I create free content. If you liked this post and would like to read more posts about javascript, please check it out 🎉🎉 If you like what I write and want to support me, please follow me on to learn more about programming and similar topics ❤️❤️ Twitter Also published on . https://www.thedailytechtalk.com/must-known-javascript-console-log-tips-tricks
