FIFO Operations

The shift() and unshift() methods are similar to the push() and pop() methods. The difference is that while the push() and pop() methods add and remove elements from the end of the array, the shift() and unshift() methods roll out and in elements from the beginning of the array. The push() and pop() methods support the Stack abstract data type, which is based on the LIFO (Last In First Out) model. The shift() and unshift() methods, on the other hand, support the FIFO (First In First Out) model.

The shift() method shifts off and returns the first element of the array, decreasing its size by one. Here is the method to be declared as a prototype of the Array object type:

function shift(str) {
  var val = this[0];
  for (var i = 1; i < this.length; ++i) {
    this[i-1] = this[i];
  }
  this.length--;
  return val;
}

The first line sets the returned value, the first element of the array. The for loop iterates over the array elements and shifts every element to its previous position:

this[i-1] = this[i];

The last two lines decrement the size of the array by one and returned the value of the first element, val.

When the browser is a pre-5.5 version, we need to extend the Array's prototype with the new shift() method:

if (bName() == 1 && bVer() >= 5.5)
else {
  Array.prototype.shift = shift;
}

We do nothing when the browser is IE 5.5 or higher. For other browsers or lower versions, we assign the home-brewed shift() method. Let's take an example that shows the usage of the shift() method:

var line = new Array("aaa", "bbb", "ccc", "ddd", "eee");
alert("first = " + line.shift() + " Other = " + line);

You can find the code itself in a later page of this column. Go ahead and run this script now. You should get a window like this:

The unshift() method appends a list of elements to the beginning of the array. Here is our implementation:

function unshift() {
  var i = unshift.arguments.length;
  for (var j = this.length - 1; j >= 0; --j) {
    this[j + i] = this[j];
  }
  for (j = 0; j < i; ++j) {
    this[j] = unshift.argument[j];
  }
}

We extract the number of new elements, i, from the arguments array's length. The first for loop shifts all existing elements i places up:

this[j + i] = this[j];

The second for loop inserts the new elements into the first i places of the array:

this[j] = unshift.arguments[j];

When the browser is a pre-5.5 version, we need to extend the Array's prototype with the new unshift() method:

if (bName() == 1 && bVer() >= 5.5)
else {
  Array.prototype.unshift = unshift;
}

We do nothing when the browser is IE 5.5 or higher. For other browsers or lower versions, we assign the home-brewed unshift() method. Let's take an example that shows the usage of the unshift() method:

var line = new Array("ccc", "ddd", "eee");
line.unshift("aaa", "bbb");
alert(line);

You can find the code itself in a later page of this column. Go ahead and run this script now. You should get a window like this:

Next: How to detect object-property relations