CODEWITHSUNDEEP
javascriptjsonobject
Julius Martin
Julius Martin

Reputation: 199

How access child object of JSON-structure in Javascript?

I need to retrieve information from a JSON-structure in Javascript I had this first: 

<script type="text/javascript">
    var jsonfile= '{"products": 
                       {"productInfo1": "test",
                        "productInfo2": "test" }
                   }'; 

    var digitalData = JSON.parse(jsonfile);
    console.log(digtialData.products.productInfo1); 
    console.log(digtialData.products.productInfo2); 
</script>

I get the output "test" in my console window. This worked fine. But it seems that I need to declare new objects, for proper use. As I understand, they don't like this solution. The method described above would be bad . So I tried to create a new script. 

<script type="text/javascript">
    var digitalData = new digitalData();
    var product = new digitalData.product();
    var productInfo1 = new digitalData.product.productInfo1();
    var productInfo1 = new digitalData.product.productInfo2();
    productInfo1 = "test";
    productInfo2 = "test";
    console.debug(digitalData.product.productInfo);
    console.debug(digitalData.product.productInfo);
</script>

Then I get the error: "Uncaught TypeError: undefined is not a function index.php? route=product/product&path=57&product_id=49:265 (anonymous function)"

I tried various variants, and abused Google to find an answer how get this work. I found some answers, like to get digitalData.product working. But I'm looking to get the 3rd object working, and link that in any way to 1/2 objects (digitalData and product).

Anyone have suggestions how to solve this?

Upvotes: 1

Views: 768

Answers (3)

Mehran Hatami
Mehran Hatami

Reputation: 12961

firstly new keyword is just for functions, in javascript. then if you do:

var digitalData = new digitalData();

It means you have a function in your code and you want to create a object based on that.

Second you can get all your inner objects in your object like this:

digtialData.products
digtialData["products"]

and for the rest:

digtialData.products.productInfo1
digtialData["products"].productInfo1
digtialData["products"]["productInfo1"]

you can also create a class like function, like:

DigitalData = function DigitalData(){
    this.products = [];
};
DigitalData.prototype.addProduct = function(info1, info2){
    var product = new DigitalData.Product();
    product.productInfo1 = info1;
    product.productInfo2 = info2;
    this.products.push(product);
};

DigitalData.Product = function Product(info1, info2){
    this.productInfo1 = info1;
    this.productInfo2 = info2;
};
var digitalData = new DigitalData();
digitalData.addProduct("test1", "test2");
digitalData.addProduct("test11", "test22");

var jsonString = JSON.stringify(digitalData);

console.log(jsonString);

Upvotes: 1

Matt Burland
Matt Burland

Reputation: 45145

Not quite sure why you had a problem with the first approach. But to use the second approach, you need to define you objects before you can instantiate them with new

 function DigitalData() {

 }

 var digitalData = new DigitalData();

Then for product you could do something like this:

 function Product() {

 }

 digitalData.product = new Product();

But it might be easier to actually instantiate that in the constructor for DigitalData because otherwise, what's the point of the constructor?

 function DigitalData() {
      var self = this;
      self.product = new Product();    
 }

 var digitalData = new DigitalData();
 var product = digitalData.product;

Now the productInfo1 and 2 part sounds like it ought to be an array. So you could do something like this:

 function ProductInfo(name) {
      var self = this;
      self.name = name;
 }

 function Product(arrayofNames) {
      var self = this;
      self.productInfo = arrayofNames.map(function(n) { new ProductInfo(n); });
 }

 function DigitalData(arrayofNames) {
     var self = this;
     self.product = new Product(arrayOfNames);
 }

 var digitalData = new DigitalData({ "product1","product2" });

 console.log(digitalData.product.productInfo[0].name);   // logs "product1"

But if you don't want to use the array, then:

 function Product() {
      var self = this;
      self.productInfo1 = new ProductInfo();
      self.productInfo2 = new ProductInfo();
 }

Upvotes: 1

Purushotham
Purushotham

Reputation: 3820

Try this 

var digitalData = new Object();
var products = new Object();
products.productInfo1 = "test";
products.productInfo2 = "test";

digitalData.products = products;

console.debug(digitalData.products.productInfo1);
console.debug(digitalData.products.productInfo2);

Upvotes: 1

Related Questions