Question

I have some JSON returned to the browser like this “product”:

{ "Title": "School Bag", "Image": "/images/school-bag.jpg" }

I want this data to be a “Product” object so I can use prototype methods like a toHTMLImage() that returns a HTML image representation of the product:

function Product() { }
Product.prototype.toHTMLImage = function() { //Returns something like <img src="<Image>" alt="<Title>" /> }

How do I convert my JSON results into a Product object so that I can use toHTMLImage?

Answer 1

Simple, if I got it,

var json = { "Title": "School Bag", "Image": "/images/school-bag.jpg" }
function Product(json) {
    this.img = document.createElement('img');
    this.img.alt = json.Title;
    this.img.src = json.Image;

    this.toHTMLImage = function() {
        return this.img;
    }
}

var obj = new Product(json); // this is your object =D