Fun with JavaScript Arrays

I don’t often see other developers on my team exploiting the abilities of Arrays in JavaScript. Here are some fun tricks I often use.

Better Conditionals

Its pretty common that I end up needing to write some code to quickly check if some condition is satisfied.

Using Arrays for better re-use and readability.

Often times I’ll see code to check for some condition written in the style below.

// standard way with chained OR
function isSupported(type) {
  return type === ‘heavy’ ||
    type === ‘light’ ||
    type === ‘thick’ ||
    type === ‘rich’;
}

// this can be reused for other purposes
// also easily editable and understandable
const supportedTypes = [
  ‘heavy’,
  ‘light’,
  ‘thick’,
  ‘rich’
];

// rather than hard coding an if statement 
// or chaining else, we use a list.
function isSupportedType(type) {
  return supportedTypes.includes(type);
} 

Using a list to make sure conditions pass

In the example below we can use JavaScripts reduce function to test some variable.

This example makes sure all conditions pass, but can be easily updated to test for at least one condition passing.

// we can define all the criteria we want to pass
// as an array of functions which return true or false 
const conditions = [
  (number) => number > 0,
  (number) => number % 2 === 0
];


function test(num) {
  // use the reduce function to iterate
  // through the conditions we want to test
  return conditions.reduce((pass, conditionFn) =>
    pass && conditionFn(num), true);
}

Rest Parameters

Somewhat related, it’s sometimes nice to create a function that can deal with an arbitrary amount of arguments.

// use the rest operator to collect 
// all parameters to an Array
function logItem(…items) {
   items.forEach(item => 
    console.log(item);
}

logItem(1); // like most people expect
logItem(1, 2); // or call with arbitrary num of arguments 

const items = [1, 2, 3];
logItem(…items); // or even use an array with the spread operator