Please enable Javascript for better experience...
Difference between console.log(), console.group() and console.groupCollapsed() in javascript
By Rahul Kumar Jha | Apr 22, 2016 | In Articles | Total Views [ 4078 ]
Taged In
(0 Like)
Rate

In this article I will explain basic difference between console.log(), console.group() and console.groupCollapsed().

Introduction

We generally use console.log() to log things on console bar while testing in front end language i.e javascript/jquery. But there are few other options which can be used to categorize logging into groups to make it more readable. You can use console.group() and console.collapse() for this purpose. They are different from each other in functionality. Let's try these one by one.

console.log()

This is simple logging console method popularly known. You can log a data in console using console.log() method.

<script type="text/javascript">
console.log('This is simple example of console.log()');
console.log('This is second line');
</script>

console.group()

You can group a set of values using console.group() method.

<script type="text/javascript">
console.group('console.group() example');
console.log('Line 1');
console.log('Line 2');
console.groupEnd();
</script>

Nested group

You can create nested group adding console.group() inside a parent console.group() method.

<script type="text/javascript">
console.group('console.group() example');
console.log('Line 1');
console.log('Line 2'); console.group('Nested console.group() example');
console.log('Line 3');
console.log('Line 4'); console.groupEnd();
console.groupEnd();
</script>

console.groupCollapsed()

This is similar as console.group() but with a collapse feature. You can collapse the set of logs using console.groupCollapsed() method.

     console.groupCollapsed('console.groupCollapsed() example');
     console.log('Line 1);
     console.log('Line 2);
     console.groupEnd();

Hope this helps you. You can use these as you require in your project.

Share this

About the Author

Rahul Kumar Jha
Rahul Kumar Jha
Founder, Developer dotnet-concept.com

Public profile: user/profile/99900001


Has working experience in different phases of Software Development Life Cycle (SDLC) in CMS, Gaming, Health Care and Financial Services domain using Agile pattern. Working experience in Design patterns, ASP.NET, MVC, ANGULAR, ANGULAR JS, Windows application, WCF, ADO.NET, SQL Server and Test Driven Development (TDD) environment with JQuery, JavaScript, N-Unit, Entity Frameworks, LINQ, Code Refactoring and Business Objects Models.

User's Comments


 
Please SignUp/Login to comment...

Or comment as anonymous...
* Name
* Email ID
Comment
 
 
 
 
 
 
Sponsors