What are some ways you can log debug messages and data in JS?

JavaScript: What are some ways you can log debug messages and data in JS?

There are a few commonly used functions used for logging debug messages. You can use these to show data and messages in your console. In chrome, press cmd + alt + i to show the inspector and click the console tab.

console.log

console.log('something', another_variable, []) - This is the most common one. You can put any variable to this and it will provide some kind of output to the console.

Timing stuff

console.time('some_id');
/*... do something here ...;*/
console.timeEnd('some_id')

The code above will tell you the duration between the time and timeEnd calls. You must use the same identifier in both calls.

Show data as a table

console.table({foo:123, bar:456}) - this will generate a nice looking table

Show errors and warnings

console.warn('a warning') - as its name suggests, it will show a warning in the console.

console.error('Uh oh! an error!') - this will show an error in the console. It is useful to do this, especially for debugging in the browser. You can click through to the line/location of the source of the error.

Clearing the console.

And if you have too much in your console, you can do console.clear() to clear things up.

webdevetc profile pic
webdevetc

I am a 29 year old backend web developer from London, mostly focusing on PHP and Laravel lately. This (webdevetc.com) is my blog where I write about some web development topics (PHP, Laravel, Javascript, and some server stuff). contact me here.



More...


Comments and discussion about What are some ways you can log debug messages and data in JS?

Found this interesting? Maybe you want to read some more in this series?

Or see other topics in the JavaScript language

Or see other languages/frameworks:
PHP Laravel Composer Apache CentOS and Linux Stuff WordPress General Webdev and Programming Stuff JavaScript
Or see random questions

How to check if a string contains a certain substring?

How to query mysql using PDO in PHP?

How to find the 2nd most common item in an array?

How to see all of the options for an artisan command?

How to Enable Directory Listings in Apache with .htaccess

How to have a whitelist of IP addresses that can access files in .htaccess

How to check if a user is logged in, inside a blade file?

Why should you update APP_URL from from http://localhost?

How to block an IP address in .htaccess

How to find out what version of Laravel you are using?