Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

View the list of all variables in Google Chrome Console using JavaScript

  • Last Updated : 20 Sep, 2019

All the variables in Google Chrome can be listed for the use of debugging. There are two approaches to list all variables:

Method 1: Iterating through properties of the window object: The window object in JavaScript represents the current browser’s window. The properties of this object can be used to find the variables of the Chrome browser. Each of the properties of the window object is first checked with the hasOwnProperty() method. This ensures that the object has the property as its own property.

Hey geek! The constant emerging technologies in the world of web development always keeps the excitement for this subject through the roof. But before you tackle the big projects, we suggest you start by learning the basics. Kickstart your web development journey by learning JS concepts with our JavaScript Course. Now at it's lowest price ever!

Syntax:




for (let variable in window) {
    if (window.hasOwnProperty(variable)) {
        console.log(variable);
    }
}

Example:






<!DOCTYPE html>
<html>
  
<head>
    <title>
        View the list of all variables in Google
        Chrome Console in JavaScript
    </title>
</head>
  
<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
      
    <b>
        View list of all JavaScript variables
        in Google Chrome Console
    </b>
      
    <p>
        Click on the button to view list of
        all JavaScript variables in the
        Google Chrome Console
    </p>
      
    <button onclick="findAllVariables()">
        Click here
    </button>
      
    <script type="text/javascript">
        function findAllVariables() {
            for (let variable in window) {
                if (window.hasOwnProperty(variable)) {
                    console.log(variable);
                }
            }
        }
    </script>
</body>
  
</html>

Output:
in-window-output
Console Output:
in-window-console

Method 2: Using the Object.keys() method: The Object.keys() method is used to return the properties of the given object as an array. As the window object represents the current browser’s window, the properties of this object can be used to find the variables like the previous method.
The Object.keys() method is passed the window object as the parameter to get its keys. Each of the keys in this object represents a variable of the Google Chrome browser. These can then be listed in the console.

Syntax:




let variables = Object.keys(window);
console.log(variables);

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        View the list of all variables in Google
        Chrome Console in JavaScript
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        View list of all JavaScript variables
        in Google Chrome Console
    </b>
      
    <p>
        Click on the button to view list
        of all JavaScript variables in 
        the Google Chrome Console
    </p>
      
    <button onclick="findAllVariables()">
        Click here
    </button>
      
    <script type="text/javascript">
        function findAllVariables() {
            let variables = Object.keys(window);
            console.log(variables);
        }
    </script>
</body>
  
</html>

Output:
objectkeys-output
Console Output:
objectkeys-console




My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!