JavaScript merge multiple Boolean arrays with the OR || operator

There are times when you need to merge multiple Boolean arrays into a single array in JavaScript. One common approach is to combine the corresponding elements from each array using the OR (||) operator. This operation returns true if at least one of the elements being compared is true; otherwise, it returns false. In this article, we'll learn how to merge multiple Boolean arrays into a single array using JavaScript, specifically by applying the OR operator on corresponding elements.

Problem Definition

We are given an array of arrays of Boolean values, like this:

Input:

const arr = [[true, false, false], [false, false, false], [false, false, true]];
console.log("Input arrays:", arr);

Input arrays: [ [ true, false, false ], [ false, false, false ], [ false, false, true ] ]

The merging logic works as follows:

• The first index will be true because the first subarray has true at the first index.
• The second index will be false because all subarrays have false at that index.
• The third index will be true because one of the subarrays has true at the third index.

Expected Output:

[true, false, true]

Using reduce() Method

JavaScript's reduce() function is perfect for merging multiple Boolean arrays with the logical OR (||) operator. It allows us to accumulate results across multiple iterations over an array.

The algorithm works as follows:

• The reduce() method iterates over the array of arrays, where the accumulator holds the merged result.
• Inside reduce(), we use forEach() to iterate over each element in the current subarray.
• For each Boolean value, we apply the OR (||) operator using acc[ind] = acc[ind] || bool.
• This ensures that if any subarray has true at the current index, the result for that index will be true.

Example Implementation

const arr = [[true, false, false], [false, false, false], [false, false, true]];

const orMerge = arr => {
    return arr.reduce((acc, val) => {
        val.forEach((bool, ind) => acc[ind] = acc[ind] || bool);
        return acc;
    }, []);
};

console.log("Original arrays:", arr);
console.log("Merged result:", orMerge(arr));

Original arrays: [ [ true, false, false ], [ false, false, false ], [ false, false, true ] ]
Merged result: [ true, false, true ]

Alternative Approach Using map()

Here's another approach using the map() method for comparison:

const arr = [[true, false, false], [false, false, false], [false, false, true]];

const orMergeWithMap = arr => {
    if (arr.length === 0) return [];
    
    return arr[0].map((_, index) => 
        arr.some(subArray => subArray[index])
    );
};

console.log("Using map() method:", orMergeWithMap(arr));

Using map() method: [ true, false, true ]

Handling Edge Cases

// Empty array
console.log("Empty array:", orMerge([]));

// Single array
console.log("Single array:", orMerge([[true, false, true]]));

// All false values
console.log("All false:", orMerge([[false, false], [false, false]]));

Empty array: []
Single array: [ true, false, true ]
All false: [ false, false ]

Conclusion

Using JavaScript's reduce() and forEach() methods provides a clean and efficient solution for merging multiple Boolean arrays with the OR operator. This approach handles corresponding elements across arrays and returns true when at least one array has true at that position.