Fun with JavaScript Arrays
Chris Andrade
Posted on March 12, 2022
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
Posted on March 12, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 25, 2024
November 15, 2024
November 2, 2024