DEV Community

Cover image for Top 7 JavaScript One-Liners: Your Path to Cleaner, Readable Code 📜
Kushal sharma
Kushal sharma

Posted on • Edited on

Top 7 JavaScript One-Liners: Your Path to Cleaner, Readable Code 📜

#webdev #javascript #react #beginners

Hi, in this article, we are going to discuss how a one-liner in JavaScript can improve our code quality and readability.

First, let's discuss what one-liners in JavaScript are.

This is not a JavaScript keyword or anything specific in JS; it's just a term that refers to accomplishing coding tasks in a single line, instead of using multiple lines or blocks.

For a better explanation, I am going to first write code in the traditional, or less efficient, way and then demonstrate how one-liners come to the rescue.

1) Sum of an array of elements 

let numbers = [1, 2, 3, 4, 5]; let sum = 0; for (let i = 0; i < numbers.length; i++) { sum += numbers[i]; }
Enter fullscreen mode Exit fullscreen mode

one-liner

let numbers = [1, 2, 3, 4, 5]; let sum = numbers.reduce((acc, num) => acc + num, 0);
Enter fullscreen mode Exit fullscreen mode

2) Removing Duplicates from an Array 

let numbers = [1, 2, 2, 3, 4, 4, 5]; let uniqueNumbers = []; for (let i = 0; i < numbers.length; i++) { if (!uniqueNumbers.includes(numbers[i])) { uniqueNumbers.push(numbers[i]); } }
Enter fullscreen mode Exit fullscreen mode

one-liner

let numbers = [1, 2, 2, 3, 4, 4, 5]; let uniqueNumbers = [...new Set(numbers)];
Enter fullscreen mode Exit fullscreen mode

3) Swap Two Varaibles 

 let a = 10; let b = 20; let temp = a; a =b; b = temp;
Enter fullscreen mode Exit fullscreen mode

one-liner

[b, a] = [a, b]
Enter fullscreen mode Exit fullscreen mode

4) Reverse a string 

let str = 'hello'; let reversedStr = ''; for (let i = str.length - 1; i >= 0; i--) { reversedStr += str[i]; }
Enter fullscreen mode Exit fullscreen mode

one-liner

let str = 'hello'; let reversedStr = str.split('').reverse().join('');
Enter fullscreen mode Exit fullscreen mode

5) Count Occureance of elements in array 

let numbers = [1, 2, 2, 3, 4, 4, 5]; let count = {}; for (let i = 0; i < numbers.length; i++) { if (count[numbers[i]]) { count[numbers[i]]++; } else { count[numbers[i]] = 1; } }
Enter fullscreen mode Exit fullscreen mode

One-liner:

let numbers = [1, 2, 2, 3, 4, 4, 5]; let count = numbers.reduce((acc, num) => { acc[num] = (acc[num] || 0) + 1; return acc; }, {});
Enter fullscreen mode Exit fullscreen mode

6) Checking if an Object Contains a Specific Key 

let myObject = { name: 'Alice', age: 30 }; let hasKey = false; for (let key in myObject) { if (key === 'age') { hasKey = true; break; } }
Enter fullscreen mode Exit fullscreen mode

One liner

let myObject = { name: 'Alice', age: 30 }; let hasKey = 'age' in myObject;
Enter fullscreen mode Exit fullscreen mode

7) Find Intersection of Two Array 

let array1 = [1, 2, 3, 4]; let array2 = [3, 4, 5, 6]; let intersection = []; for (let i = 0; i < array1.length; i++) { for (let j = 0; j < array2.length; j++) { if (array1[i] === array2[j]) { intersection.push(array1[i]); break; } } }
Enter fullscreen mode Exit fullscreen mode

One liner

let array1 = [1, 2, 3, 4]; let array2 = [3, 4, 5, 6]; let intersection = array1.filter(value => array2.includes(value));
Enter fullscreen mode Exit fullscreen mode

Hope you liked this article, The above examples come into our day-to-day life. Hope when it comes next you will use a one-liner for that ;)

If you are on Twitter, can you follow me there as well? I post these kinds of stuff there as well. => Follow @kushal_js

Top comments (5)

Collapse
 
devdufutur profile image
Rudy Nappée •

One-liner:
let numbers = [1, 2, 2, 3, 4, 4, 5];
let count = numbers.reduce((acc, num) => {
acc[num] = (acc[num] || 0) + 1;
return acc;
}, {});

Isn't the purpose of a one-liner to take 1 line ? 😁

Collapse
 
jonrandy profile image
Jon Randy 🎖️ • • Edited 
let count = numbers.reduce((acc, num) => (acc[num] = ~~acc[num]+1, acc), {})
Enter fullscreen mode Exit fullscreen mode

Reverse string above is also not very good; try it with str = "Hello 😊" - it will break. Better, but not perfect is:

let reversedStr = [...str].reverse().join``
Enter fullscreen mode Exit fullscreen mode
Collapse
 
sharmakushal profile image
Kushal sharma •

haha here the one-liner is

 acc[num] = (acc[num] || 0) + 1;
Enter fullscreen mode Exit fullscreen mode
Collapse
 
kalkwst profile image
Kostas Kalafatis •

While the brevity and consiseness of one-liners can be appealing, I really believe that one liners are a kind of a code smell. One-liners tend to condense a lot of operations and logic in one line, making them harder to understand. Also when you want to debug your code, one-liners tend to make it harder. Finally, I feel like one-liners are a barrier for effective collaboration.

Collapse
 
sheikhelmoctar profile image
Sheikh El-Moctar •

It's great idea, but I think code'll be difficult to read.