Odd javascript array behaviour. Can it be fixed?

Question

I have a multi-dimensional array like so:

var map = [[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]];

I then have a few functions that "resize" the array in both dimensions, depending on some variables. This is how I do it:

function resizeArr(arr, rows, rowsDiff, cols, colsDiff) {
    var arrLength = arr.length;

    if (colsDiff > 0) {
        i=0;
        while (i<arrLength) {
            j=0;
            while (j<colsDiff) {
                arr[i].push(0);
                j++
            }
            i++
        }
    }
    if (colsDiff < 0) {
        i=0;
        while (i<arrLength) {
            j=0;
            colsDiffAbs = Math.abs(colsDiff);
            while (j<colsDiffAbs) {
                arr[i].pop();
                j++
            }
            i++
        }
    }

    if (rowsDiff > 0) {
        fullColsArr = makeArrayOf(0, cols);
        i=0;
        while (i<rowsDiff) {
            arr.push(fullColsArr);
            i++
        }
    }
    if (rowsDiff < 0) {
        rowsDiffAbs = Math.abs(rowsDiff);
        i=0;
        while (i<rowsDiffAbs) {
            arr.pop();
            i++
        }
    }
    return arr;
}

Basically, with those 4 if statements, I pop out some values or push some new ones (zeros) depending on whether the rowsDiff/colsDiff variables are positive or negative.

My problem is when I resize the array from a max of map[4][4] to map[9][9], it looks like everything's okay, because I get:

[[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0]] 

as my new array, which looks right. However, when I try to assign a particular value to map[9][9], it fills up the last value of each new array like so:

[[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,14],[0,0,0,0,0,0,0,0,0,14],[0,0,0,0,0,0,0,0,0,14],[0,0,0,0,0,0,0,0,0,14],[0,0,0,0,0,0,0,0,0,14]]

If I try to assign a value to the second to last value (map[9][8]), it fills up the second to last values of all the others, too.

But when I assign a value to an original part of the array, it works properly. Just what am I doing wrong here?

I've tried to explain it to the best of my ability- feel free to ask for further details.

Answer 1

You're pushing the same array multiple times when you expand by rows. Therefore each new row of the array is just pointing the same place (the same column array). Thus when you change one, they "all" appear to change.

Instead, you want to create a new array for each new row and push that:

if (rowsDiff > 0) {
    i=0;
    while (i<rowsDiff) {
        arr.push(makeArrayOf(0, cols));
        i++
    }
}