ArticleZip > Remove Empty Strings From Array While Keeping Record Without Loop

Remove Empty Strings From Array While Keeping Record Without Loop

Have you ever needed to filter out empty strings from an array in your code without using loops? It may sound like a tricky task, but fear not, as there is a straightforward method that can help you achieve this without writing extra lines of looping code.

In JavaScript, the `filter` method comes to the rescue when you want to remove specific elements from an array based on a condition. When dealing with empty strings, you can take advantage of the built-in capabilities of `filter` to clean up your array efficiently.

Javascript

const arrayWithEmptyStrings = ['apple', '', 'banana', '', 'cherry', '', ''];
const filteredArray = arrayWithEmptyStrings.filter(Boolean);

In this code snippet, we have an array `arrayWithEmptyStrings` that contains some empty strings alongside other elements. By calling the `filter` method on this array and passing in `Boolean` as the callback function, we instruct `filter` to remove any falsy values, such as empty strings, from the array.

The `Boolean` function in JavaScript coerces its argument to a boolean value. For an empty string `''`, the boolean evaluation results in `false`, causing `filter` to exclude it from the filtered array `filteredArray`.

This elegant solution allows you to remove all occurrences of empty strings from your array in a single line of code without resorting to manual iteration through each element.

Moreover, if you need to keep a record of the removed empty strings for reference or further processing, you can achieve this easily by using functional programming concepts in JavaScript.

Javascript

const arrayWithEmptyStrings = ['apple', '', 'banana', '', 'cherry', '', ''];
const { emptyStrings, nonEmptyStrings } = arrayWithEmptyStrings.reduce((acc, current) => {
    current === '' ? acc.emptyStrings.push(current) : acc.nonEmptyStrings.push(current);
    return acc;
}, { emptyStrings: [], nonEmptyStrings: [] });

console.log(emptyStrings); // ['','']
console.log(nonEmptyStrings); // ['apple','banana','cherry']

In this snippet, we utilize the `reduce` method on the `arrayWithEmptyStrings` array to split the elements into two separate arrays based on whether they are empty strings or non-empty strings. The `reduce` method accumulates the elements into distinct arrays within the accumulator object according to the evaluation check.

By examining the `emptyStrings` and `nonEmptyStrings` arrays after the reduction operation, you can keep track of the removed empty strings while retaining the non-empty elements for further processing in your application logic.

By leveraging the native methods available in JavaScript, you can efficiently handle the task of removing empty strings from an array without using explicit loops, making your code cleaner and more concise.

Next time you encounter a similar scenario in your coding adventures, remember these techniques to streamline your array manipulations and boost your productivity. Happy coding!

×