10 Awesome JavaScript One-Liners
Gyanendra Kumar Knojiya
Posted on November 13, 2021
I’d like to share some mind-blowing javascript one-liners with you today that can save you a lot of time.
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.
buy a coffee for me https://www.buymeacoffee.com/gyanknojiya
Posted on November 13, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.