Post
Ask Question

Learn JavaScript Part 16: Dynamic Objects

  1. <!DOCTYPE html>  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4.     <title></title>  
  5. </head>  
  6. <body>  
  7.     <script id="javascript">  
  8.   
  9.         //Object Creation  
  10.         var personalDetail = 
  11.         {  
  12.             fname: "Akshay",  
  13.             lname: "Patel",  
  14.             "registered email":"[email protected]",  
  15.             address:  
  16.                 {  
  17.                     Add1: "Old Padra Road",  
  18.                     Add2: "Diwalipura",  
  19.                     City: "Vadodara",  
  20.                     State: "Gujarat",  
  21.                     Pin: "390020"  
  22.                 }  
  23.         };  
  24.   
  25.         //Object Access  
  26.   
  27.         //Dot Pattern  
  28.         var fname = personalDetail.fname;  
  29.   
  30.         //Bracket Pattern  
  31.         var lname = personalDetail["lname"];  
  32.   
  33.         var registeredEmail = personalDetail["registered email"];  
  34.   
  35.         //Pattern 1  
  36.         var address = personalDetail.address;  
  37.         var city = address.City;  
  38.   
  39.         //Pattern 2  
  40.         var state = personalDetail.address.State;  
  41.   
  42.         alert(fname + " " + lname + " \n" + registeredEmail + " \n" + city + " " + state);  
  43.     </script>  
  44. </body>  
  45. </html> 

Output

Akshay Patel
[email protected]
Vadodara Gujarat

Add members on the fly in the preceding object

  1. personalDetail.mobile = "09769496026";  
  2. alert(personalDetail.mobile);  

Output

09769496026

Enumerating Members

  1. for(var member in personalDetail)  
  2. {  
  3.    alert(member);                  //Member Name  
  4.    alert(personalDetail[member]);  //Member value  
  5. } 

Output

fname

Akshay

lname

Patel

and so on.