JavaScript Console
Written By: Avinash Malhotra
Updated on
Console
JavaScript Console or Browser console is build-in object in JavaScript which gives access to browser debugging console. console can be used to print output, check errors and warnings in console.
For frontend and web developer, its is recommended to open console window always. We can call global functions, check variables and syntax errors in console.
Open Browser Console
Browser | Console Shortcut for Windows / Linux | Console Shortcut for Mac |
---|---|---|
Chrome | Ctrl + Shift + j | Cmd + Alt + j. |
Firefox | Ctrl + Shift + k | Cmd + Alt + k |
Microsoft Edge | Ctrl + Shift + j | Cmd + Alt + j. |
Internet Explorer | Ctrl + 2 or F12 | NA |
Edge | Ctrl + 2 or F12 | Cmd + Alt + j |
Safari | Ctrl + Alt + c | Cmd + Alt + c |
console.log()
console.log is used to print output in browser console. We can print string or any others datatype.
console is build-in object and log is method of console.
print in console
Hello JS
console.log("Hello JS");
Print variable in console
Tech Altum
var fname="Tech";
var lname="Altum";
console.log(fname,lname);
Placeholder in console
We can also use Placeholder like %s, %d to insert string or numbers.
String Placeholder
Name is Tech Altum
var name="Tech Altum";
console.log("Name is %s",name);
Number Placeholder
Id is 12
var id=12;
console.log("Id is %d",id);
Style console output
To add style in console, use %c and add css property:value in second argument.
This color is red
console.log("This color is %cred","color:red");
This text is highlighted
console.log("This text is %chighlighted text","background:yellow");
console.log in NodeJS
console.log is also used in NodeJS to print output in terminal.
console.warn
console.warn is used to print warnings in browser console.
⚠️ its a warning
console.warn('its a warning');
console.error
error found
console.error('error found');
console.table
console.table is used to display Arrays and Objects data in console. The argument in table method is either a Array or Object.
Print object in console.table
(index) | Value |
---|---|
name | avi |
id | 212 |
console.table({name:"avi",id:212})
Print array in console.table
(index) | Value |
---|---|
0 | "abc" |
1 | "pqr" |
2 | "xyz" |
console.table(["abc","pqr","xyz"])
Print array of object in console.table
(index) | name | id |
---|---|---|
0 | avi | 212 |
1 | isha | 200 |
console.table([{name:"avi",id:212},{name:"isha",id:200}])
console.time
console.time() is used to measure time ( in ms) taken by task to run.
console.time([label]) starts a new timer. To print code execution time since console.time([label]), use console.timeEnd([label]) method.
timer: 842.64794921875 ms
console.time('timer');
alert(2);
console.timeEnd('timer');
Check Loop timer
timer: 3310.26611328125 ms
console.time('timer');
for(var i=1; i<=1000; i++){
document.querySelector('select.num').innerHTML+="<option>"+ i +"</option>";
}
console.timeEnd('timer');
console.clear
console.clear method is used to clear browser console. This will remove all previously printed console messages and print a messages "Console was cleared" in some browsers.
Console was cleared
console.clear();
console.assert
console.assert method is used to print errors if assertion is false. If it is true, it does nothing.
Assertion failed: console.assert
console.assert(1===true);
console.assert(1==true);