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

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];
}

one-liner

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

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

one-liner

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

3) Swap Two Varaibles

 let a = 10;
 let b = 20;
 let temp = a;
  a =b;
  b = temp;

one-liner

[b, a] = [a, b]

4) Reverse a string

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

one-liner

let str = 'hello';
let reversedStr = str.split('').reverse().join('');

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

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;
}, {});

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

One liner

let myObject = { name: 'Alice', age: 30 };
let hasKey = 'age' in myObject;

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

One liner

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

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

Comments

[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 ? 😁

[Jon Randy 🎖️]

let count = numbers.reduce((acc, num) => (acc[num] = ~~acc[num]+1, acc), {})

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

[Kushal sharma]

haha here the one-liner is

 acc[num] = (acc[num] || 0) + 1;

[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.

[Sheikh El-Moctar]

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