Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

How to access first value of an object using JavaScript ?

  • Last Updated : 04 Sep, 2019

There are many methods to access the first value of an object in JavaScript some of them are discussed below:

Example 1: This example accesses the first value object of GFG_object by using object.keys() method.

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!




<!DOCTYPE html>  
<html>  
    <head
        <title
            How to access first value of
            an object using JavaScript ?
        </title
    </head
      
    <body style = "text-align:center;">  
          
        <h1 style = "color:green;" >  
            GeeksForGeeks  
        </h1
          
        <p id = "GFG_UP" style = "color:green;">
        </p>
          
        <button onclick = "gfg_Fun()"
            find First
        </button
          
        <p id = "GFG_DOWN" style = "color:green; font-size: 20px;">
        </p>
          
        <script
          
            // Declare an object
            var GFG_object = {prop_1: "GFG_1",
                    prop_2: "GFG_2", prop_3: "GFG_3"};
              
            var el_up = document.getElementById("GFG_UP");
            var el_down = document.getElementById("GFG_DOWN");
              
            // Use SON.stringify() function to take object
            // or array and create JSON string
            el_up.innerHTML = JSON.stringify(GFG_object);
              
            // Access the first value of an object
            function gfg_Fun() {  
               el_down.innerHTML = GFG_object[Object.keys(GFG_object)[0]]; 
           }
        </script
    </body>  
</html>

Output:

  • Before clicking on the button:
  • After clicking on the button:

Example 2: This example accesses the first value of object GFG_object by looping through the object and breaking the loop on accessing the first value.






<!DOCTYPE html> 
<html
    <head
        <title
            How to access first value of
            an object using JavaScript ?
        </title
    </head
      
    <body style = "text-align:center;"
      
        <h1 style = "color:green;"
            GeeksForGeeks 
        </h1
      
        <p id = "GFG_UP" style = "color:green;"></p>
          
        <button onclick = "gfg_Fun()"
            find First
        </button
          
        <p id="GFG_DOWN" style="color:green;font-size:20px;"></p>
          
        <script
          
            // Declare an object
            var GFG_object = {prop_1: "GFG_1",
                    prop_2: "GFG_2", prop_3: "GFG_3"};
              
            var el_up = document.getElementById("GFG_UP");
            var el_down = document.getElementById("GFG_DOWN");
              
            // Use SON.stringify() function to take object
            // or array and create JSON string
            el_up.innerHTML = JSON.stringify(GFG_object);
              
            // Function to access the first value of an object
            function gfg_Fun() { 
                for (var prop in GFG_object) {
                    el_down.innerHTML = GFG_object[prop]
                    break;
                }
            }         
        </script
    </body
</html>                    

Output:

  • Before clicking on the button:
  • After clicking on the button:

Example 3: This example accesses the first value of objectGFG_object by using object.values() method.




<!DOCTYPE html> 
<html
    <head
        <title
            JavaScript | Access the first value of an object
        </title
    </head
      
    <body style = "text-align:center;"
          
        <h1 style = "color:green;"
            GeeksForGeeks 
        </h1
          
        <p id = "GFG_UP" style = "color:green;"></p>
          
        <button onclick = "gfg_Fun()"
            find First
        </button
          
        <p id = "GFG_DOWN" style = "color:green; font-size: 20px;"></p>
          
        <script
          
            // Declare an object
            var GFG_object = {prop_1: "GFG_value",
                    prop_2: "GFG_2", prop_3: "GFG_3"};
              
            var el_up = document.getElementById("GFG_UP");
            var el_down = document.getElementById("GFG_DOWN");
              
            // Use SON.stringify() function to take object
            // or array and create JSON string
            el_up.innerHTML = JSON.stringify(GFG_object);
              
            // Function to access the first value of an object
            function gfg_Fun() { 
                el_down.innerHTML = Object.values(GFG_object)[0];
        }         
        </script
    </body
</html>                    

Output:

  • Before clicking on the button:
  • After clicking on the button:



My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!