HCL Domino Leap Tutorial

Appearance

Console ​

The console is a powerful tool available in most modern web browsers and Node.js environments. It provides a way to execute JavaScript code in real-time and outputs the results, making it an invaluable resource for debugging and learning. When you write JavaScript code, you can use the console to print information, which helps you understand what your code is doing or where it might be going wrong.

How to Access the Console ​

In Web Browsers you can open the console in most web browsers by right-clicking the webpage and selecting " Inspect" or "Inspect Element," then navigating to the "Console" tab. Alternatively, you can use keyboard shortcuts like Ctrl+Shift+J on Windows/Linux or Cmd+Option+J on macOS.

Basic Console Methods ​

Here are some of the most common methods provided by the console object:

  • console.log(): This is the most used console method. It logs or prints any message or variable to the console. It's incredibly useful for checking the values of variables at certain points in your code.

    javascript
    console.log('Hello, world!');
console.log('The value of x is:', x);

  • console.error(): This method is used to log errors to the console. It's helpful for debugging purposes, as it makes error messages stand out from regular log messages.

    javascript
    console.error('An error occurred!');

  • console.warn(): Similar to console.error(), but used for warning messages. These messages are also styled differently in the console to differentiate them from regular log messages and errors.

    javascript
    console.warn('This is a warning message.');

  • console.info(): This method is similar to console.log() but is used to log informational messages. The visual distinction between console.log() and console.info() varies between different browsers.

    javascript
    console.info('This is an informational message.');

  • console.table(): This method allows you to display data in a tabular format. It's very useful for displaying arrays or objects in a structured table.

    javascript
    console.table([{ name: 'Alice', age: 30 }, { name: 'Bob', age: 25 }]);

  • console.clear(): Clears the console. This can be useful for removing clutter from the console before running more tests or code.

    javascript
    console.clear();

Practice Exercise ​

Try the following exercise to practice using the console:

  1. Open your browser's console.
  2. Use console.log() to print your name.
  3. Use console.error() to print an error message of your choice.
  4. Create an array of objects where each object represents a person, including properties for name and age. Use console.table() to display this array in the console.
solution
javascript
const people = [
    {name: 'John', age: 28},
    {name: 'Jane', age: 32},
    {name: 'Doe', age: 45}
];
console.table(people);

Conclusion ​

The console is a fundamental tool in JavaScript development, providing an immediate way to inspect values, debug code, and log information. By familiarizing yourself with the console and its various methods, you'll enhance your debugging skills and become more efficient at JavaScript development. Remember, practice is key to mastering these concepts, so make sure to experiment with the console methods and use them as you learn and build your JavaScript projects.