JavaScript – Array Construction Tricks Using Abstraction

I have been having some fun with Array construction lately. You can do some really fun, elegant things with JavaScript. Here are some fun and cool looking snippets that make some pretty useful/awesome Arrays using abstraction.


makeEmptyArray(size):

function makeEmptyArray(size){
   return Array(size).join(' ').split(" ");
}

Before we do some awesome stuff, we need arrays that don’t have undefined elements. We do this by making an array, then joining and splitting the array so that its elements are not undefined (Array(size) makes an array with all undefined elements, this won’t do if we want to map the array). You can picture it this way: imagine you have 5 boxes, but these 5 boxes are collapsed and still need to be constructed before you can start putting things in them, and that is exactly what this function does.


fillArray(size,filler):

function fillArray(size,filler){
   return makeEmptyArray(size).map(function(){ return filler; });
};

Here we have a simple function that fills in the empty array with some filler.


zeroes(size):

function zeroes(size){
   return fillArray(size,0);
}

This is just an example of a function that would be practical.


mapArray(size,mapFunc):

function mapArray(size,mapFunc){
   return makeEmptyArray(size).map(mapFunc);
}

Here is a really fun function that is also really simple in design. It allows you to make an extremely custom array with just a few lines of code.


range(start,end):

function range(start,end){
   return start>=end ? [] : mapArray(end-start, function(){ return start++; });
}

This small function will create an array from start to end with end being exclusive, and if there is a problem with the indexes it just returns an empty array.

In practice, range(0,7) would return [0,1,2,3,4,5,6].


grid(width,height):

function grid(width, height, gridFunc){
   return mapArray(height, function(){ return mapArray(width, gridFunc); });
}

Don’t you love abstraction? This function makes a grid with a width width and a height height using gridFunc as the manner of filling in the elements.

Using this, a simple line of code can fill in a grid of zeroes:

var zeroRectangle = grid(7,4,function(){ return 0 });

Identity Matrix

function identityMatrix(n){
   var i = 0;
   function gridFunc(value,index,array){
      var y = Math.floor((i++)/n);
      return index == y ? 1 : 0;
   };
   return grid(n,n,gridFunc);
}

I think this function shows just how powerful abstraction can be when it comes to arrays.


Here are all of the functions from this post in one code snippet.

All of the code:

function makeEmptyArray(size){
   return Array(size).join(' ').split(" ");
}

function mapArray(size,mapFunc){
   return makeEmptyArray(size).map(mapFunc);
}

function range(start,end){
   return start>=end ? [] : mapArray(end-start, function(){ return start++; });
}

function grid(width, height, gridFunc){
   return mapArray(height, function(){ return mapArray(width, gridFunc); });
}

function identityMatrix(n){
   var i = 0;
   function gridFunc(value,index,array){
      var y = Math.floor((i++)/n);
      return index == y ? 1 : 0;
   };
   return grid(n,n,gridFunc);
}

Isn’t abstraction fun?

-Brandon Layton
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: