DEV Community

Cover image for Some useful JavaScript One-Liners
Shshank
Shshank

Posted on • Edited on

Some useful JavaScript One-Liners

JavaScript is one of the most powerful language in this modern world. In this article we will go through some of the useful JavaScript one-liners.

  • If you want to get the text that a user selects or highlights on a web page, there is a useful one-liner for that.
const getSelectedText = () => window.getSelection().toString();
console.log(getSelectedText);
Enter fullscreen mode Exit fullscreen mode
  • There is a method called scrollTo(x,y), it allows you to scroll to a particular set of used coordinates.
const scrollToTop = () => window.scrollTo(0,0);
Enter fullscreen mode Exit fullscreen mode
  • If you want to have a smooth scrolling animation, just do something like this:
const Top = () => window.scrollTo({top:0, behavior: 'smooth'});
Enter fullscreen mode Exit fullscreen mode
  • Internet bandwidth is basically the amount of data is being transferred over an internet connection in a specified period of time.
navigator.connection.downlink;
Enter fullscreen mode Exit fullscreen mode
  • If you want to redirect user to a specified location, you can do something like this:
const urlRedirect = url => location.href = url;
urlRedirect('https://dev.to/');
Enter fullscreen mode Exit fullscreen mode

Hope you'll find some useful snippets in this code. Comment if you have more other than these.

You may also like to read: Killer JavaScript One Liners

Happy Coding Devs.

Top comments (10)

Collapse
 
lexlohr profile image
Alex Lohr

Small typo in your smooth scrolling example, missing ' at the end of smooth. Instead of your urlRedirect function, you can directly call location.assign(url).

Collapse
 
shshank profile image
Shshank

Thank you, for pointing my mistake. And yes we can use location.assign(url) aswell.

Collapse
 
joelbonetr profile image
JoelBonetR 🥇

A bit of background to this redirection thingy.

If you use location without specifying to which API you are referring to if could apply either to document or window.
Both usually work the same as most modern browsers map document.location to window.location and also some replaced document.location to document.URL to avoid confustion.
Still window.location is the canonical way (recommended).

Setting the value of href creates effectively a navigation which will be in the window.history, if you want to avoid this, you can use window.location.replace() or, if you want to modify the current URI to, let's say, delete the query string but without reloading, you can use the window.history API instead.

Sorry for not adding the references, I'm on the phone right now but you can probably find all this info inside mdn. 😁

Collapse
 
dennistobar profile image
Dennis Tobar

Hi,

navigator.connection.downlink; is useful if you are not using Firefox or Safari (see can I use)

Collapse
 
shshank profile image
Shshank

thanks for updating.

Collapse
 
lvtraveler profile image
lvtraveler

very nice!🌹

Collapse
 
fayomihorace profile image
Horace FAYOMI

Nice one. thanks

Collapse
 
timhuang profile image
Timothy Huang

Simple and useful. Thanks for sharing.

Collapse
 
wboswall profile image
William Boswall

awesome snippets!
I was wondering if these snippets can be used in all browsers and not just a selected few? Asking for a friend.

Collapse
 
khnbzkrt profile image
Hakan ANGIN

Thanks for sharing. Very useful for me that you shared informations.