DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 966,904 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for 1 line of code: How to get every even item of an Array
martin krause
martin krause

Posted on • Updated on

1 line of code: How to get every even item of an Array

const evenItems = arr = arr.filter((_, index) => index % 2 === 0);
Enter fullscreen mode Exit fullscreen mode

Returns an array which contains every even item of the original array.


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

Collapse
 
lexlohr profile image
Alex Lohr

Or you use the fastest possible version:

const evenItems = (arr, out = [], i) => { for (i = 0; i < arr.length; i = i + 2) out.push(arr[i]); return out; };
Enter fullscreen mode Exit fullscreen mode
Collapse
 
lukeshiru profile image
Luke Shiru

I mean, you could just use a filter, which is faster and from my point of view is also more readable:

const evenItems = array => array.filter((_, index) => index % 2 === 0);
Enter fullscreen mode Exit fullscreen mode

Cheers!

Collapse
 
jamesthomson profile image
James Thomson

+1 for this. I'll always prefer legible over performant unless dealing with code that absolutely requires performance. 99% of the time I'm dealing with small datasets so it isn't necessary. And as you've said below, v8 optimises a lot of these convenience methods.

Collapse
 
jzombie profile image
jzombie • Edited on

I would have thought filter was indeed slower, but not according to this.

Thread Thread
 
martinkr profile image
martin krause Author

It is one of the cases where performance really depends on the browser / javascript engine.

Thread Thread
 
jzombie profile image
jzombie

Agreed.

I tested it w/ Chrome, on Mac & Linux. Not sure how Safari / Firefox results may vary.

Collapse
 
martinkr profile image
martin krause Author

Hi Luke,

you are right filter is more intuitive, but it is actually slower for me.

Cheers!

Collapse
 
lexlohr profile image
Alex Lohr

No, it isn't faster. Not sure what's wrong with your machine, but it's about 20-30% slower on any machine I tested it on.

Collapse
 
martinkr profile image
martin krause Author

Hey!

thank you for taking the time to contribute, I put both functions to the performance benchmark on hasty and I'm going to update the article with your suggestion!

Cheers!

Collapse
 
lukeshiru profile image
Luke Shiru

You forgot to run the code in that benchmark, so you're only testing the declaration of both functions, not the actual function running ... here you have an actual comparison. With filter it is faster.

Thread Thread
 
martinkr profile image
martin krause Author

Hi Luke,
yes you are right :D Here is the updated benchmark on hasty - filter is much slower for me.

Thread Thread
 
lukeshiru profile image
Luke Shiru • Edited on

Try moving the funciton declarations to the global block (you only need to declare them once and then run them). Maybe is slower in non-chromium browsers, I'm testing on Chrome.

Edit: Tried it in Safari and performance sucks there. Chromium makes optimizations in this kind of algorithms that other browsers don't. From a logic stand point the for approach effectively should run in half the time because is skipping the odd indexes instead of filtering them. Still I would prefer that other browsers optimize my code as Chromium does so I can write simple code and it gets optimized for me.

Thread Thread
 
lexlohr profile image
Alex Lohr

I just ran that test and for was 20% faster on current Chrome.

Thread Thread
 
lukeshiru profile image
Luke Shiru

For me too. Chromium based browsers are faster with filter.

Thread Thread
 
martinkr profile image
martin krause Author

Appreciate the discussion. Going to use the filter version as I expect the other browsers / javascript engines to catch up in microoptimisations.

Thread Thread
 
lexlohr profile image
Alex Lohr

Then at least use & instead of % if you care about performance. That difference can't be microoptimized, because the modulo requires float point handling, whereas the binary operation runs directly on the CPU.

🌚 Browsing with dark mode makes you a better developer by a factor of exactly 40.

It's a scientific fact.