How to access first value of an object using JavaScript ?
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.
<!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:
