CODEWITHSUNDEEP
javascriptjquery
user1456767
user1456767

Reputation: 69

How to create a dynamic array in Javascript?

I need to create the following array dynamically, for example:

var data = { point: [
              { x:5, y:8 },
              { x:8, y:10},
              ]};

 console.log(data.point[0].x);   // 5  n=0
 console.log(data.point[1].y);   // 10 n=1

At some point my application needs to expand the array to more than 2 items (n=0, n=1). Please let me know how to do that (i.e. n = 9 ).

Upvotes: 2

Views: 281

Answers (4)

jwatts1980
jwatts1980

Reputation: 7356

You could do something like this:

var data = {'points' : []};

function addPoint(x, y) {
    data.points.push({'x' : x, 'y' : y});
}

function getPoint(index) {
    return data.points[index];
}

addPoint(10, 20);
addPoint(5, 3);

var p = getPoint(1);
alert(p.x + ", " + p.y); //alerts => "5, 3"

This would work for any arbitrary number of points.

Update

To clear the array

function clearPoints() {
    data.points = [];
}

Update 2

These little functions will work okay if you have a simple page. If this points handling is going to end up being part of a larger system, it may be better to do something like this:

var data = {
    'points' : [], 
    addPoint : function(x, y) {
        this.points.push({
            'x' : x, 
            'y' : y
        });
    }, 
    getPoint : function(index) {
        return this.points[index];
    }, 
    clearPoints : function() {
        this.points = [];
    }, 
    removePoint : function(index) {
        this.points.splice(index, 1);
    }
};

Example usage:

alert(data.points.length); // => 0

data.addPoint(1, 2);
data.addPoint(8, 12);
data.addPoint(3, 7);
alert(data.points.length); // => 3

var p = data.getPoint(2); //p = {x:3, y:7};

data.removePoint(1); 
alert(data.points.length); // => 2

data.clearPoints();
alert(data.points.length); // => 0

It may allow you to keep your point handling a little cleaner and easier to use and update.

Upvotes: 0

Robert
Robert

Reputation: 8767

You can either use the push() function as stated, or add additional items to the array using an index, which is preferred in the Google Style Guide. The latter method does require that you have a pointer to the last index.

Note that since assigning values to an array is faster than using push() you should use assignment where possible.

for(var i=lastIndex; i < numOfNewPoints; i++){
    data.point[i] = {x:4, y:3};
}

Upvotes: 0

Hacker Wins
Hacker Wins

Reputation: 1289

you can use method 'push' like this code

        var data = { point: [
                      { x:5, y:8 },
                      { x:8, y:10},
                      ]};

         console.log(data.point[0].x);   // 5  n=0
         console.log(data.point[1].y);   // 10 n=1

        data.point.push({x:4,y:3});

        console.log(JSON.stringify(data.point));

Upvotes: 1

xdazz
xdazz

Reputation: 160953

You could use Array.push method to add element to an array.

var point = {x:1,y:1};
data.point.push(point);

Upvotes: 2

Related Questions