Some Useful Console Command!

Some useful console command

The JavaScript console is a component of the browser's Developer Tools that helps us track and monitor errors and warnings in the scripts we write or run. It serves as a vital tool for managing your code and troubleshooting potential issues.

alert('Hello from the other side')

It should show a browser alert with the text. Well didn't meant to scare ya...

The console is very useful to display information and values from our script/code.

Console methods

The browser environment's global object provides access to a console object with many useful methods that can be used to interact with the JavaScript console from JavaScript files.

console.log()

The most common console method: it will print whatever value we pass to the console as an argument to the log() method, either a string, a number, a boolean, an object, an array, a function or a combination of them. It will output the value to the console.

Log a number

Different data types will have different colors in the console

console.log(42);

Log a string

console.log('I hate bread');

Log multiple values

You can separate values with a comma

console.log(42, 'ronins', true);

Log a variable

For the most part, we use the console to debug and log out variables or the result of a function or network request.

x = "I love Interstellar!!";
console.log(x);

console.error()

using console.error() will make the text red

console.error('Err... error');

console.warn()

Using console.warn() will give you a warning

console.warn('Darth Vader is coming for you');

console.clear()

console.clear()

console.table()

If you want to log an object as a table

console.table({ name: 'Batman', city: 'Gotham' });

console.group()

console.group('Marvel Superheroes');
console.warn('Loki');
console.error('Thanos');
console.log('Ironman, Thor... finally...');
console.groupEnd();
console.log('What about DC?');

Log with style

const styles = 'padding: 15px; background-color: green; color: pink;';
console.log('%cwell well well', styles);

This may not be super useful in production, but it can be a little easter egg for us developer :D