JS arrays - how to build an array

Question

    var adList = new Array();
    adList[0]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';/*
    adList[0]["h3"] = 'Product title2';
    adList[0]["button"]["link"] = '#link-url';
    adList[0]["button"]["text"] = 'Buy now';
    adList[0]["h3"] = 'asdfasdfasdf';

    adList[1]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';
    adList[1]["h3"] = 'Product title2';
    adList[1]["button"]["link"] = '#link-url';
    adList[1]["button"]["text"] = 'Buy now';
    adList[1]["h3"] = 'asdfasdfasdf';

I'm getting an error adList[0] is undefined, can I not define arrays like this? Do I have to specify adList[0] as an array before I assign variables to it?

Randy the Dev · Accepted Answer · 2010-12-03 02:20:21Z

4

The problem is that you're trying to refer to adList[0] which hasn't had a value assigned to it. So when you try to access the value of adList[0]['img'], this happens:

adList           -> Array
adList[0]        -> undefined
adList[0]["img"] -> Error, attempting to access property of undefined.

Try using array and object literal notation to define it instead.

adList = [{
    img: 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg',
    h3: 'Product title 1',
    button: {
        text: 'Buy now',
        url: '#link-url'
    }
},
{
    img: 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg',
    h3: 'Product title 2',
    button: {
        text: 'Buy now',
        url: '#link-url'
    }
}];

Or you can simply define adList[0] and adList[1] separately and use your old code:

var adList = new Array();
adList[0] = {};
adList[1] = {};
adList[0]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';
... etc etc

edited Dec 3, 2010 at 2:20

answered Dec 3, 2010 at 2:12

Randy the Dev

26.9k6 gold badges46 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

subhaze Over a year ago

beat me to it :P here's a JSFiddle showing a live example of the array/object mix i was going to use. jsfiddle.net/subhaze/A8vmX

Dark Falcon · Accepted Answer · 2010-12-03 02:06:54Z

2

You must do:

adList[0] = new Array();

in similar fashion to how you created adList itself.

answered Dec 3, 2010 at 2:06

Dark Falcon

44.2k6 gold badges91 silver badges104 bronze badges

Comments

Josh Hinman · Accepted Answer · 2010-12-03 02:14:03Z

2

You can also use object notation:

 adList = [
 {
   "img": 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg',
   "h3": 'Product title2',
   "button": {"link": '#link-url',
              "text": 'Buy now'},
   "h3": 'asdfasdfasdf'
 }, {
   "img": 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg',
   "h3": 'Product title2',
   "button": {"link": '#link-url',
              "text": 'Buy now'},
   "h3": 'asdfasdfasdf'
}];

answered Dec 3, 2010 at 2:14

Josh Hinman

6,8057 gold badges41 silver badges47 bronze badges

Comments

Gordon Gustafson · Accepted Answer · 2010-12-03 02:13:48Z

1

Yyou have to specify what the arrays contains before you can start doing stuff with it. Its just like trying to use any other uninitialized variable.

var adList = new Array();
sizeOfArray = 5;
for (var i=0; i < sizeOfArray; i++) {
    adList[i] = new Array();
}

adList[0]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';

This will initialize the contents of adList at 0-4 with arrays. THEN you can go on assigning their values.

Note that adList[0]["img"] doesn't actually use the arrays' indexes. Since the array is an object, it lets you set its properties anyway. This is the same as adList[0].img.

edited Dec 3, 2010 at 2:13

answered Dec 3, 2010 at 2:07

Gordon Gustafson

41.4k26 gold badges119 silver badges160 bronze badges

Comments

Sarin · Accepted Answer · 2010-12-03 02:21:34Z

Your problem is that adList[0] and adList[1] have not been inititalized. This has nothing to do with adList being an Array.

So, adList[0] = new Object(); before assigning property values should work for what you are trying to do.

var adList = new Array();
    adList[0] = new Object();
    adList[0]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';/*
    adList[0]["h3"] = 'Product title2';
    adList[0]["button"]["link"] = '#link-url';
    adList[0]["button"]["text"] = 'Buy now';
    adList[0]["h3"] = 'asdfasdfasdf';

    adList[1] = new Object();
    adList[1]["img"] = 'http://www.gamer-source.com/image/media/screenshot/thumbnail/489.jpg';
    adList[1]["h3"] = 'Product title2';
    adList[1]["button"]["link"] = '#link-url';
    adList[1]["button"]["text"] = 'Buy now';
    adList[1]["h3"] = 'asdfasdfasdf';

Collectives™ on Stack Overflow

JS arrays - how to build an array

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related