Remove Whitespace-only Array Elements

Question

Since using array.splice modifies the array in-place, how can I remove all whitespace-only elements from an array without throwing an error? With PHP we have preg_grep but I am lost as to how and do this correctly in JS.

The following will not work because of above reason:

for (var i=0, l=src.length; i<l; i++) {
 if (src[i].match(/^[\s\t]{2,}$/) !== null) src.splice(i, 1);
}

Error:

Uncaught TypeError: Cannot call method 'match' of undefined

• canon: Do you actually want to change the array in place or are you alright with generating a second, filtered array?

Answer 1

A better way to "remove whitespace-only elements from an array".

var array = ['1', ' ', 'c'];
array = array.filter(function(str) {
 return /\S/.test(str);
});

Explanation:

Array.prototype.filter returns a new array, containing only the elements for which the function returns true (or a truthy value).

/\S/ is a regex that matches a non-whitespace character. /\S/.test(str) returns whether str has a non-whitespace character.

• Barmar: He has l=src.length in the initialization section of the for loop, not the test section.
• canon: Array.splice() doesn't modify an array in-place? Explain, please.
• tenub: running on 4.5 hours of sleep led me to miss the simple issue that i was trying to cache the array length when i actually shouldn't have been. >_< the question now is which method achieves the same goal quickest or with the least amount of effort?
• Paul Draper: @tenub, that answer will depend on how often whitespace elements appear in practice. (e.g. lots, almost never, etc.). The more whitespace elements, the faster filter is than splice. If there are almost never whitespace elements, splice is faster.
• canon: @tenub, caching the length wasn't the only issue. When you remove an item from an array it shifts the remaining items down an index... so, you'll skip the one that was shifted down into the current index, i.

Answer 2

Another filter based variation - reusable (function)

 function removeWhiteSpaceFromArray(array){
 return array.filter((item) => item != ' ');
}

Answer 3

const words = ['spray', 'limit', 'elite', 'exuberant', ' ', ''];
const result = words.filter(word => word.trim().length > 0);
console.log(result);

Answer 4

a="remove white spaces"

a.split(' ').join('').split('');

It returns an array of all characters in {a="remove white spaces"} with no 'space' character.

You can test the output separately for each method: split() and join().

Answer 5

You removed an item from the array which reduced the array's length. Your loop continued, skipped some indexes (those which were down-shifted into the removed index), and eventually attempted to access an index outside of the new range.

Try this instead:

var src = ["1"," ","2","3"];
var i = src.length; 
while(i--) !/\S/.test(src[i]) && src.splice(i, 1);
console.log(src);

Answer 6

Just simply do this example

// this is you array 
let array = ["foo","bar","",""]
// remove blanks in array 
let array_new_value = array.join(" ").trim().split(' ');
// Print to know if really works 
console.log(array_new_value);

I hope this helps you!!

Answer 7

And for a new generation (namely ES2015):

['1', ' ', 'c'].filter(item => item.trim() !== '')

More on trim()

Answer 8

Here's another approach.

var data = JSON.parse(arrayval.split(/\s/).join(''));

• tripleee: This does something else than what the question asks for.

Answer 9

function clearSpace(arr){
 for (var key in arr) {
 if (arr[key] == "") {
 arr.splice(key, 1)
 clearSpace(arr)
 }
 }
}
var arr = ["","a","b","",""]
clearSpace(arr)
//I hope this helps you!!
//Vu Tien Luong - 3GTEL

• Ran Marciano: Please don't post only code as an answer, but also provide an explanation of what your code does and how it solves the problem of the question. Answers with an explanation are usually more helpful and of better quality, and are more likely to attract upvotes