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

Do you actually want to change the array in place or are you alright with generating a second, filtered array? — canon, Dec 18 '13 at 21:36

Paul Draper · Accepted Answer · 2013-12-18T21:48:52.837

31

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.

edited Dec 18 '13 at 21:48

answered Dec 18 '13 at 21:36

Paul Draper

78,542
46
206
285

He has `l=src.length` in the initialization section of the `for` loop, not the test section. – Barmar Dec 18 '13 at 21:42
[Array.splice()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice) _doesn't_ modify an array in-place? Explain, please. – canon Dec 18 '13 at 21:43
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? – tenub Dec 18 '13 at 21:48
@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. – Paul Draper Dec 18 '13 at 21:53
@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`. – canon Dec 30 '13 at 14:07
I've modified the code to the following, filtering undefined values etc out: ````return !!str && /\S/.test(str);```` – timbru31 Sep 24 '15 at 18:28

score 5 · Answer 2 · answered Jul 15 '16 at 06:13

5

Another filter based variation - reusable (function)

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

answered Jul 15 '16 at 06:13

liron_hazan

1,396
2
19
27

score 4 · Answer 3 · answered Apr 06 '20 at 05:52

4

const words = ['spray', 'limit', 'elite', 'exuberant', ' ', ''];

const result = words.filter(word => word.trim().length > 0);

console.log(result);

answered Apr 06 '20 at 05:52

Surojit Paul

1,232
9
11

score 3 · Answer 4 · answered Feb 11 '18 at 20:00

3

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().

answered Feb 11 '18 at 20:00

Gosha

51
4

score 2 · Answer 5 · edited Jun 30 '17 at 13:48

2

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);

edited Jun 30 '17 at 13:48

Jed Fox

2,979
5
28
38

answered Dec 18 '13 at 21:38

canon

40,609
10
73
97

score 0 · Answer 6 · answered Dec 17 '15 at 07:07

0

And for a new generation (namely ES2015):

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

More on trim()

answered Dec 17 '15 at 07:07

Adrian Lynch

8,237
2
32
40

score 0 · Answer 7 · answered Aug 10 '19 at 08:55

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!!

score 0 · Answer 8 · edited Sep 10 '20 at 07:17

0

Here's another approach.

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

edited Sep 10 '20 at 07:17

tripleee

175,061
34
275
318

answered Sep 10 '20 at 07:01

Seshagiri Batsala

1
1

This does something else than what the question asks for. – tripleee Sep 10 '20 at 07:18

score 0 · Answer 9 · answered Dec 09 '20 at 03:46

0

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

answered Dec 09 '20 at 03:46

VU TIEN LUONG

1

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 – Ran Marciano Dec 09 '20 at 06:28

Remove Whitespace-only Array Elements

9 Answers9

Linked