CODEWITHSUNDEEP
javascriptarraysobject
James Stoddern
James Stoddern

Reputation: 417

Javascript arrays or object

I wish to grab content from various sources, using different API calls, and collate them all into an object or array with the same format. I am getting stuck with javascript arrays and objects, and none of the examples I find seem to do what I want to do. This is the format I want to store. This is pseudo coded for an example of what I want to achieve

var content = new Object();
getTweets();
getSoundCloud();
display();


function getTweets() {

    //first result
    content.type = "tweet
    content.text = "the text of the tweet"
    content.image = "the image from the tweet"

    return content;
}

function getSoundCloud() {
    //second result
    content.type = "soundcloud
    content.text = "the name of the song"
    content.image = "the image of the song"

    return content;
}


function display() {
    //for each content
    {
        $("#container").append(content.text);
    }

}

The first result is generated by one function call, and the Second result is generated by a different function call.

I want these functions to add all of the content together into the same format object. Once the object is populated, I wish to iterate it in a different function and display on the screen.

How do I make this object? I have tried it but the data is always the same, ie, overwritten with the same values. In php this would be an associative array perhaps or something like

I want to have an object for each piece of content I have, and can loop through it

content[0].type = "tweet"
content[1].type = "coundcloud"

Any suggestions with examples would be great.

Many Thanks

Upvotes: 1

Views: 157

Answers (4)

James Stoddern
James Stoddern

Reputation: 417

Actually, just sussed it out like this

var content = {
    text: this.text.linkify().linkuser().linktag(),
    image: this.profile_image_url,
    type: 'tweet'
};

arrayContent.push(content);

I can now loop through it, and each Content and display it!

Upvotes: 0

HBP
HBP

Reputation: 16063

content should be an array of objects, each function adds its object into the content array :

var content = []; // empty array
getTweets();
getSoundCloud();
display();


function getTweets() {
    content.push ({  //first result
      type: "tweet",
      text: "the text of the tweet",
      image: "the image from the tweet"
    });
}

function getSoundCloud() {
    content.push ({  //second result
      type: "soundcloud",
      text: "the name of the song",
      image: "the image of the song"
    });
}


function display() {
    content.forEach (v) {
       // code to format the object v appropriately
       var vtext = v.type + ' : ' + v.text;
        $("#container").append(vtext);
    }

}

Upvotes: 0

vtortola
vtortola

Reputation: 35965

I have done an example here: http://jsfiddle.net/pdXsA/2/

var content = [];
content.push(getTweets());
content.push(getSoundCloud());
display();

function getTweets() {
    return{
        type : "tweet",
        text : "the text of the tweet",
        image : "the image from the tweet"                    
    };
}

function getSoundCloud() {
    return{
        type : "soundcloud",
        text : "the name of the song",
        image : "the image of the song"                    
    };
}

function display() {
    content.forEach(function(item){
        $("#container").append(item.text +"<br/>");
    });
}​

Upvotes: 0

Matt
Matt

Reputation: 75327

When you have many of something you should immediately think

I need to store these things in an array.

When your "things" are complex and have various properties/ state, you should immediately think:

I need to create an object to store them.

... so what would be best here is an array of objects. Each function will create objects and add them to content, which we'll switch to an array:

var content = []; // Array
getTweets();
getSoundCloud();
display();


function getTweets() {
    var tweet = {}; // This is an object

    tweet.type = "tweet";
    tweet.text = "The text of the tweet";
    tweet.image = "The image of the tweet";

    content.push(tweet); // add the object to the array.
}

function getSoundCloud() {
    var soundcloudThing = {};

    soundcloudThing.type = "soundcloud"
    soundcloudThing.text = "the name of the song"
    soundcloudThing.image = "the image of the song"

    content.push(soundcloudThing);
}

Now when it comes to showing this content, as have an array; the obvious thing to do here is iterate over it;

function display() {
    for (var i=0;i<content.length;i++)
    {
        $("#container").append(content[i].text);

        // You can also use content[i].image and content[i].type in here
    }
}

Note that [] and {} is literal notation for creating arrays and objects. It's use is favoured over new Array() and new Object().

Upvotes: 3

Related Questions