DEV Community

Cover image for Mastering Javascript One-Liners to Look Like a Pro

Mastering Javascript One-Liners to Look Like a Pro

ben ajaero on February 22, 2024

Mastering Javascript One-Liners to Look Like a Pro Javascript one-liners are all about writing succinct, efficient, and elegant pieces o...
Collapse
 
oculus42 profile image
Samuel Rouse • Edited

There are a lot of great one-liners in here that can be very useful, but we may need to be more careful with array shuffling. For some purposes a simple random shuffle will suffice, but most shuffles have bias in them, and the amount of bias can depend on the JavaScript engine.

The Fisher-Yates shuffle is reliable and unbiased.

For a good visualization of differences, take a look at Mike Bostock's page Will It Shuffle? and try it in different browsers to see the variation.

Collapse
 
benajaero profile image
ben ajaero

That's true I considered including the bias, however I thought it might confuse people more.
The Fisher-Yates algorithm is great!

Collapse
 
mrlinxed profile image
Mr. Linxed • Edited

Remember that one-liners are not always better/faster/easier.

Readability goes over being clever.

Especially when a one-liner only passes its parameters to another method like this one

const copyToClipboard = (content) => navigator.clipboard.writeText(content);
Enter fullscreen mode Exit fullscreen mode

What's wrong with just:

navigator.clipboard.writeText(content);
Enter fullscreen mode Exit fullscreen mode

If anything, the copyToClipboard should check if the clipboard API is available to use.

Collapse
 
codingjlu profile image
codingjlu

Hex to rgb can be one-lined too (not sure why you include the alpha channel if you're not doing anything to it though...):

const hexToRgb = hex => `rgb(${hex.match(/\w\w/g).map(val => parseInt(val, 16))})`
Enter fullscreen mode Exit fullscreen mode
Collapse
 
uiuxsatyam profile image
Satyam Anand

We love one liners but it can be challenging and sometimes confusing, especially for junior developers.

Btw, thanks for sharing this. Keep posting β€οΈπŸ‘

Collapse
 
boly38 profile image
Brice • Edited

I agree that we must keep attention that "one line code" cant suffice. For me a good/pro code portion is a code easy to read/understand/adopt/maintain/extend.
Lenght of the code could be a way de improve the adoption but for ex. a var name or method name or statement complexity of a block.. are impotant too. If a junior is able to quickly adopt and extend your code. Then you're a pro 😎
Thanks for this great article πŸ‘Œ

Collapse
 
benajaero profile image
ben ajaero

Thanks Brice!

Collapse
 
benajaero profile image
ben ajaero

Thank you!

Collapse
 
michaeltharrington profile image
Michael Tharrington

Just have to say that I'm really digging this cover image. It reminds me of synthwave music!

Collapse
 
benajaero profile image
ben ajaero

Thanks Michael! It was definitely inspired.

Collapse
 
kodipe profile image
Konrad PrzydziaΕ‚ • Edited

From my perspective one-liners are ok as long as they are readable. Nowadays there are a lot of bundlers, compilers etc. which are able to make it more compact so we don't write code for making computer happy. We do it for other developers who need to spend time to understand it.

One good advice: Be pro instead of look like a pro.

Collapse
 
adam_cyclones profile image
Adam Crockett πŸŒ€

There should be a disclaimer that wanting to look like a pro is not being a pro. Writing these and explaining the benefits and drawbacks is being a pro

Collapse
 
kevinbism profile image
Kevin Ramirez

Great post!

Collapse
 
benajaero profile image
ben ajaero

Thank you!

Collapse
Collapse
 
codingmaster97 profile image
codingmaster97

Javascript is great

Collapse
 
jlewis profile image
Jeremy Lewis

I use this one-liner often when a dataset contains duplicates, comes in handy:
(array) => [...new Set(array)]

Collapse
 
benajaero profile image
ben ajaero

I love that!

Collapse
 
sreno77 profile image
Scott Reno

Very useful!

Collapse
 
benajaero profile image
ben ajaero

Thanks!

Collapse
 
gajananbodhankar profile image
Gajanan Bodhankar

To capitalize first letter of each word in a string.
Image description

Collapse
 
benajaero profile image
ben ajaero

Thanks for the contribution Gajanan!

Collapse
 
manchicken profile image
Mike Stemle

Looking like a pro does not make one a pro. This is yet another in a long line of articles pretending to say something interesting while saying very little at all and adding nothing of its own.

It is surprising how many of this exact same article have been written year-to-date. It’s just so very boring.