7 More Killer One-Liners in JavaScript

Tapajyoti Bose
3 min readApr 24, 2022

--

This is a continuation of the previous list of JavaScript one-liners. If you haven’t checked out the article, you are highly encouraged to accomplish so.

Let’s crack on with the new list!

1. Sleep Function

JavaScript has NO built-in sleep function to wait for a given duration before continuing the execution flow of the code.

Luckily, generating a function for this purpose is straightforward

const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

2. Go Back to the Previous Page

Need to send the user back to the page they came from? history object to the rescue!

const navigateBack = () => history.back();
// Or
const navigateBack = () => history.go(-1);

3. Compare Objects

Javascript behaves in mysterious ways when comparing objects. Comparing objects with the === operator checks only the reference of the objects, so the following code always returns false:

const obj1 = { a: 1, b: 2 };
const obj2 = { a: 1, b: 2 };
obj1 === obj2; // false

To solve this very issue, you can create a deep comparison function:

const isEqual = (a, b) => JSON.stringify(a) === JSON.stringify(b);// examples
isEqual({ a: 1, b: 2 }, { a: 1, b: 2 }); // true
isEqual({ a: 1, b: 2 }, { a: 1, b: 3 }); // false
// works with arrays too
isEqual([1, 2, 3], [1, 2, 3]); // true
isEqual([1, 2, 3], [1, 2, 4]); // false

4. Generate Random id

Need multiple unique identifiers but not looking to add the uuid package? Try out this simple utility function:

const uuid = () =>
([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
(
c ^
(crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
).toString(16)
);

NOTE: The function is a one-liner, but spread across multiple lines for readability.

5. Get Selected Text

Want to have access to the text user selects? window just has a method to help you out!

const getSelectedText = () => window.getSelection().toString();

6. Check if an Element is Focused

You can effortlessly check if an element is currently focused without setting up the focus & blur listener.

const hasFocus = (element) => element === document.activeElement;

7. Count by the Properties of an Array of Objects

Need to count the number of items in an array that match a particular property? Using reduce on arrays can achieve the task with ease!

const countElementsByProp = (arr, prop) =>
arr.reduce(
(prev, curr) => ((prev[curr[prop]] = ++prev[curr[prop]] || 1), prev),
{}
);
// example
countElementsByProp(
[
{ manufacturer: "audi", model: "q8", year: "2019" },
{ manufacturer: "audi", model: "rs7", year: "2020" },
{ manufacturer: "ford", model: "mustang", year: "2019" },
{ manufacturer: "ford", model: "explorer", year: "2020" },
{ manufacturer: "bmw", model: "x7", year: "2020" },
],
"manufacturer"
); // { 'audi': 2, 'ford': 2, 'bmw': 1 }

NOTE: This too is a one-liner, but spread across multiple lines for readability.

That’s all folks!

Finding personal finance too intimidating? Checkout my Instagram to become a Dollar Ninja

Follow me for weekly new tidbits on the domain of tech

Need a Top Rated Front-End Development Freelancer to chop away your development woes? Contact me on Upwork

Want to see what I am working on? Check out my Personal Website and GitHub

Want to connect? Reach out to me on LinkedIn

I am a freelancer who will start off as a Digital Nomad in mid-2022. Want to catch the journey? Follow me on Instagram

--

--

Tapajyoti Bose

Top Rated Freelancer || Blogger || Cross-Platform App Developer || Web Developer || Open Source Contributor || FIRE Enthusiast