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. Syntax:

javascript

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

Example:

html

<!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:

javascript

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

Example:

html

<!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>