JavaScript console.log groups

When working with the browser console in Javascript, it is common to use console.log() to log information and debug code. However, when logging multiple pieces of related data, it can be difficult to distinguish between them in the console's output.

To make it easier to read and organize, you can use console.group() and console.groupEnd() to group related data together. Here is an example:

console.group("Fruits");

console.log("Apple");
console.log("Banana");
console.log("Orange");

console.groupEnd();

This code will create a collapsible group in the console labeled "Fruits" and will contain the logged data "Apple", "Banana", and "Orange".

You can also nest groups within other groups:

console.group("Fruits");

console.log("Apple");
console.log("Banana");

console.group("Citrus");

console.log("Orange");
console.log("Lemon");

console.groupEnd();

console.groupEnd();

This code will create a group labeled "Fruits" that contains the logged data "Apple" and "Banana", as well as a nested group labeled "Citrus" that contains the logged data "Orange" and "Lemon".

Using console.group() and console.groupEnd() is a useful technique when debugging complex code or when dealing with large amounts of data in the console. It can make the console output easier to read and understand.