As a follow-up to my previous article about the AND (&&) and OR (||) logical operators, I decided to create to Array prototype functions that mimic these operators to a certain degree:

// If array is empty, undefined is returned.  If not empty, the first element
// that evaluates to false is returned.  If no elements evaluate to false, the
// last element in the array is returned.
Array.prototype.and = function() {
  for(var i = 0, len = this.length - 1; i < len && this[i]; i++);
  return this[i];
};

// If array is empty, undefined is returned.  If not empty, the first element
// that evaluates to true is returned.  If no elements evaluate to true, the
// last element in the array is returned.
Array.prototype.or = function() {
  for(var i = 0, len = this.length - 1; i < len && !this[i]; i++);
  return this[i];
};

Here are two examples of using a series of AND (&&) operators and then doing the same thing with the Array’s new and() function to produce the same result:

// Both will show null:
alert(true && 3.14 && null && "false" && 0 && window);
alert([true, 3.14, null, "false", 0, window].and());

// Both will show "Chris West":
alert(Math.PI && alert && true && /regexp/ && {key:"value"} && "Chris West");
alert([Math.PI, alert, true, /regexp/, {key:"value"}, "Chris West"].and());

Here are two examples of using a series of OR (||) operators and then doing the same thing with the Array’s new or() function to produce the same result:

// Both will show 3.14:
alert(0 || null || 3.14 || true || "false" || undefined || window);
alert([0, null, 3.14, true, "false", undefined, window].or());

// Both will show 0:
alert(undefined || null || false || 0);
alert([undefined, null, false, 0].or());

As you can see, this function approach could prove useful in cases where you have a variable amount of values stored in an array that you need to test out. The main difference to note is the fact that when using the logical operators instead of the array of values, you know that only the things that need to be executed are executed. Look at the following example to see what I mean:

var obj = {key : "value"};

// Shows undefined:
alert(obj && obj.key && obj.key.length && obj.key2 && obj.key2.length);

// Results in an error because obj.key2 is undefined and thus doesn't have a length property.
alert([obj, obj.key, obj.key.length, obj.key2, obj.key2.length].and());

The beauty of the AND and OR operators is the fact that they are short-circuit operators. In other words, each part of the expression is executed from left-to-right until the answer can clearly be determined from the values that are found. For my example, since obj.key2 doesn’t exist, there is no reason to go any further to evaluate the expression full of &&’s. On the other hand, when we put all of the values in the array, these values are immediately evaluated. Therefore, since obj.key2 is undefined and undefined can’t have any properties, an error occurs and prevents the construction of the array. For this reason, these prototypal functions are very similar to using the logical operators but don’t always produce the same results because of how the statements execute.

Categories: BlogJavaScriptJScript

1 Comment

Chris West's Blog » JavaScript – Logical Operator Array Functions · July 1, 2011 at 10:01 PM

[…] th&#1110&#1109 article: Chris West's Blog » JavaScript – Logical Operator Array Functions share: Blog this! Bookmark on Delicious Digg this post Recommend on Facebook Buzz it up share via […]

Leave a Reply

Your email address will not be published. Required fields are marked *