DEV Community

Cover image for 1 line of code: How to clean an Array
Martin Krause
Martin Krause

Posted on

1 line of code: How to clean an Array

#javascript #webdev #productivity #codequality 
const clean = arr.filter(item => !!item || item === 0 || item === false);
Enter fullscreen mode Exit fullscreen mode

Returns a new array without empty strings, NaN, null, undefined items.

The repository & npm package

You can find the all the utility functions from this series at github.com/martinkr/onelinecode
The library is also published to npm as @onelinecode for your convenience.

The code and the npm package will be updated every time I publish a new article.

Follow me on Twitter: @martinkr and consider to buy me a coffee

Photo by zoo_monkey on Unsplash

Top comments (12)

Collapse
 
lexlohr profile image
Alex Lohr • • Edited

Interesting is that all these filtered can be coerced to false, and only the number 0 and false can, too. That would simplify the filter to:

arr.filter(item => !!item || item === 0 || item === false);
Enter fullscreen mode Exit fullscreen mode

EDIT: The original article did something like:

arr.filter(item => typeof item === 'number' && !isNaN(item) || typeof item === 'boolean' || !!item);
Enter fullscreen mode Exit fullscreen mode

Now that it is updated, the above doesn't seem to make sense, obviously.

Collapse
 
martinkr profile image
Martin Krause •

Hi,

thank you for the simplification! I updated the article and the code.

Cheers!

Collapse
 
jamesthomson profile image
James Thomson •

Next time I suggest posting an edit rather than overwriting the old article. The comment above makes no sense given the new article context.

Collapse
 
jonrandy profile image
Jon Randy 🎖️ • • Edited

Why not just this?

arr.filter(i=>i)
Enter fullscreen mode Exit fullscreen mode
Collapse
 
jonrandy profile image
Jon Randy 🎖️ • • Edited

Ah, I misread - you want to keep 0 and false. In which case, you can shorten to:

arr.filter(item => item || item === 0 || item === false)
Enter fullscreen mode Exit fullscreen mode

The !! is unnecessary.

Collapse
 
lexlohr profile image
Alex Lohr •

Because it was explicitly stated that false and 0 should not be filtered. Your code would filter them.

Collapse
 
pengeszikra profile image
Peter Vivo •

Why we would like "" from string list? "" and 0 is give false result but each means something.

[[], {}, null, undefined, "", 0, NaN, -0, Infinity]
  .filter(item => (item ?? null) !== null)
Enter fullscreen mode Exit fullscreen mode
Collapse
 
martinkr profile image
Martin Krause •

Hi Peter,

I can not exactly follow you train of thought. Would you mind to elaborate a bit?

Thank you !

Collapse
 
grendel profile image
grendel •

Empty string is something, not nothing. This kind of thinking is paramount in, for example, shell scripting/programming, where whether a string is null or simply doesn't exist changes everything about the command

Collapse
 
damjand profile image
Damjan Dimitrov •

Can be achieved with a very short statement: arr.filter(Boolean).

The comment by @lexlohr should also be regarded if we don't want to filter out values such as 0 or false.

Collapse
 
jonrandy profile image
Jon Randy 🎖️ •

Shorter than arr.filter(Boolean) is arr.filter(i=>i)

Collapse
 
martinkr profile image
Martin Krause •

Hi Damjan,

thank you for the suggestion. Indeed, this function should preserve 0 and false. Array.filter(Boolean) will be another oneliner which removes everything that is considered "false".
Cheers!

Read next

nikhil6076 profile image

Upgrading Your Angular Application to it's latest

Nikhil Sai -

dejetem profile image

Rendering( or How to Render) Animation in JSON format with LottieFiles animation in React application

JONATHAN SIMON -

1hamzabek profile image

Everything About Blazor p1

Hamza -

om0509 profile image

Docker Puppeeteer Node Railway

Om Bharti -