Saturday, February 18, 2012

JavaScript Multi-Dimensional Array Manipulator

JavaScript like any programming language supports arrays but not multidimensional arrays. But don't worry JavaScript is flexible enough to emulate the structure of multidimensional arrays.
[NOTE: Arrays in JavaScript starts in 0 index, so don't be confused =) ]

First of all, we declare usually arrays in JavaScript like this
var ar = new Array("fruit","veggies");


But you can't declare multidimensional arrays in JavaScript like what we do in most of OOP languages
var ar = new Array(new Array("fruit","veggies"),
         new Array("apple","carrot"));


Why? as you can see arrays in JavaScript are declared as new so it means arrays in JavaScript is an object.
One thing that is good in JavaScript is functions are also objects. It means they can be instantiate. So we will use the advantage of using a function to create an array.

function makeArray(size){
   this[0] = new Array(size);
}
var ar = new makeArray(3); //this will create array that can hold 3 elements



In the case of the code above the function itself become an array object(using the this[0]) and copied its values to ar variable.
Which means we can create a lot of arrays inside the function like this and let the function hold it.


function makeArray(size){
   this[0] = new Array(size);
   this[1] = new Array(size);
   this[2] = new Array(size);
}


and with the codes above you can get a multidimensional array

function food(){
   this[0] = new Array("apple","orange");
   this[1] = new Array("potato","carrot");
   this[2] = new Array("coconut","almond");
}
ar = new food();
document.write(ar[1][1]); //this prints "carrot"


this happens because the function itself became an array and you can add arrays on itself which will let you create a multidimensional array.


so I created functions that will able you to easily create and manipulate multidimensional arrays.



/*Javascript Multi-dimensional Array Creator and Manipulator
* by Mp de la Vega
*/
function mt_array(dim1_size, dim2_size){
    for (var i = 0; i < dim1_size; ++i){
        this[i] = new Array(dim2_size);
    }
    this.length = new Array(dim1_size, dim2_size);
}


function mt_array_push(addstack, haystack){
    //create a new array extending the haystack vertical length by one
    var new_arr = new mt_array(haystack.length[0]+1,haystack.length[1]);
    //copy the haystack to the new array
    for(var j = 0; j<new_arr.length[0]-1; j++){
        for(var k=0; k<new_arr.length[1]; k++){
                new_arr[j][k]= haystack[j][k];
        }
    }
    //copy the new values to the new array
    for(var s= 0; s<new_arr.length[1]; s++){
        new_arr[new_arr.length[0]-2][s] = addstack[s];   
    }
    return new_arr;
}                                                        


function mt_in_array(needle, arr_index, haystack){
    var in_array = -1;
    for(var f=0; f<haystack.length[arr_index]; f++){
        if(haystack[f][arr_index]==needle){
            in_array = f;
        }
    }
    return in_array;
}



to create a multidimensional array you must use my function mt_array and code it like this(like what I did in food function)


var newMultiDimArray = new mt_array(2,3);


the codes above will create an array with row size of 2 and column size of 3. and let insert some values.


newMultiDimArray[0][0] = "cat";
newMultiDimArray[0][1] = "dog";
newMultiDimArray[0][2] = "rat";
newMultiDimArray[1][0] = "snake";
newMultiDimArray[1][1] = "turtle";
newMultiDimArray[1][2] = "iguana";


and if you want to push some values in the array you created don't worry use mt_array_push function the first parameter is the array that you will push inside the existing array and the second parameter is the array where you will push the array. The mt_array_push will return the extended size array already included the array that was pushed. Below is a sample code on how to use it


pusharray = new Array("lion","tiger","leopard");
var pets = mt_array_push(pusharray,newMultiDimArray);


and so the multidimensional array you created has this elements arranged like this.

cat     snake     lion
dog    turtle       tiger
rat      iguana   leopard


so it means the functions is just creating another array inside of an array.


the last function which is mt_in_array returns a value whether a certain element is existing on the multidimensional array. the first parameter is the value you are looking for, the second one is in what column of the multidimensional array you gonna look and the last parameter is multidimensional array where you will gonna search. The function returns the location of the element within its column and if does not exist it will return -1. Sample usage of the function below.


document.write(mt_in_array("turtle",1,newMultiDimArray)); // will output "1"
document.write(mt_in_array("turtle",0,newMultiDimArray)); // will output "-1"
document.write(mt_in_array("jaguar",2,newMultiDimArray)); // will output "-1".