This is an extension of the hands-on section, using a few simple methods to deepen your impression of JavaScript.

The console.log method in JavaScript is used to print messages to the web console. This is helpful for debugging purposes, allowing developers to inspect the values of variables, track the flow of execution, and understand the state of the application at various points in time.

Using console.log 

  let greeting = "Hello, World!";
console.log(greeting);

This code will output “Hello, World!” to the console.

Example with More Complex Data 

  let person = {
    name: "John",
    age: 30,
    city: "New York"
};

console.log(person);

This will output the person object to the console, allowing you to inspect its properties.

Using Developer Tools in Firefox and Chrome

Chrome Developer Tools

  1. Open Developer Tools:

    • Press Ctrl+Shift+I (or Cmd+Option+I on Mac) or right-click on the page and select “Inspect”.

  2. Navigate to the Console:

    • Click on the “Console” tab to open the console.

  3. Using console.log:

    • You can type JavaScript code directly into the console and press Enter to execute it. For example:
      console.log("Hello from Chrome!");

Firefox Developer Tools

  1. Open Developer Tools:

    • Press Ctrl+Shift+I (or Cmd+Option+I on Mac) or right-click on the page and select “Inspect Element”.

  2. Navigate to the Console:

    • Click on the “Console” tab to open the console.

  3. Using console.log:

    You can type JavaScript code directly into the console and press Enter to execute it. For example:

      console.log("Hello from Firefox!");

HTML Example with console.log

Here is a complete HTML example that includes JavaScript code utilizing console.log:

  Copy code
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Console.log Example</title>
</head>
<body>
    <h1>Open the Console to See the Output</h1>
    <script type="text/javascript">
        console.log("This message is logged to the console.");

        let user = {
            username: "JaneDoe",
            email: "[email protected]"
        };
        console.log("User Information:", user);
    </script>
</body>
</html>