Some useful JavaScript One-Liners
#webdev#javascript#beginners#productivity
Shshank

Shshank @shshank

About: A coding soul

Location:
India
Joined:
May 16, 2018

Some useful JavaScript One-Liners

Publish Date: Jul 7 '22
279 10

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.

Comments 10 total

  • Alex Lohr
    Alex LohrJul 7, 2022

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

    • Shshank
      ShshankJul 8, 2022

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

  • Dennis Tobar
    Dennis TobarJul 7, 2022

    Hi,

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

    • Shshank
      ShshankJul 8, 2022

      thanks for updating.

  • Timothy Huang
    Timothy HuangJul 10, 2022

    Simple and useful. Thanks for sharing.

  • Hakan ANGIN
    Hakan ANGINJul 10, 2022

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

  • William Boswall
    William BoswallJul 10, 2022

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

  • JoelBonetR 🥇
    JoelBonetR 🥇Jul 24, 2022

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

  • lvtraveler
    lvtravelerJul 30, 2022

    very nice!🌹

  • Horace FAYOMI
    Horace FAYOMIAug 14, 2022

    Nice one. thanks

Add comment