10 Awesome JavaScript One-Liners

Good day, everyone! Gyanendra here, 2 years of experience as a Full Stack developer. I’d like to share some mind-blowing javascript one-liners with you today.

1. Reverse a string

We can split a string. As a result, we’ll have an array. We can revert this array and join to get a string.

let str = 'codingcafe';
str = str.split('').reverse().join('');
console.log(str);

// efacgnidoc

2. Get query parameters from the URL

To obtain query parameters, we must first divide the URL at “?” and then replace “=” with “:” and **“&” **with “,”. As we did here-

function getQueryParams(URL) {
  console.log(decodeURI(URL.split('?')[1]));
  URL = JSON.parse('{"' + decodeURI(URL.split('?')[1]).replace(/&/g, '","').replace(/=/g, '":"') + '"}');
  return URL;
}
getQueryParams('https://codingcafe.co.in?name=gyan&age=24');

// {name: 'gyan', age: '24'}

3. Check Odd/Even

The remainder becomes 0 when we divide an even integer by two. Otherwise, it’s an odd number.

function isEven(num) {
  return num % 2 === 0 ? true : false;
}
isEven(5);

// false

4. Clipboard API

To copy a text, we can use JavaScript navigator.

const copy = (text) => navigator.clipboard.writeText('Hello world!');

To paste text:

const text = navigator.clipboard.readText();

5. Remove duplicate from an Array

We can make a set from an array to get rid of duplicates.

const removeDuplicates = (ary) => {
  return [...new Set(ary)];
};
removeDuplicates([5, 6, 1, 2, 3, 6, 3, 5, 1]);

// [5, 6, 1, 2, 3]

6. Shuffle an array:

We can use array.sort() with (Math.random() — 0.5). **Math.random() — 0.5 **is a random number, which may be positive or negative.

function shuffle(array) {
  array.sort(() => Math.random() - 0.5);
}
shuffle([3, 7, 6, 5]);

// [7, 5, 3, 6]

7. Check to see if the current tab is visible or focused

we can **document.hidden **to check-

const inView = () => document.hidden;
inView();

// Result: returns true or false depending on if tab is focused

8. Check to see if the Element is focused

we can **document.activeElement **to check-

const inView = (el) => el === document.activeElement;
inView(element);

// Result: returns true or false depending on if element is focused

9. Scroll to top

The x- and y-coordinates to scroll to will be sent to the window.scrollTo() function. We’ll scroll to the top of the page if we set these to zero and zero.

const scrollToTop = () => window.scrollTo(0, 0);

scrollToTop();

10. Scroll to the bottom

The x- and y-coordinates to scroll to will be sent to the window.scrollTo() function. We’ll scroll to the bottom of the page if we set these to zero and the height of the page.

const scrollToBottom = () => window.scrollTo(0, document.body.scrollHeight);

scrollToBottom();

Conclusion

Thanks for reading this article. I hope you like this article.

If you have any queries, feel free to contact me- https://gyanendra.tech/#contact