Member-only story

24 Modern ES6 Code Snippets to Solve Practical JavaScript Problems

Useful snippets to keep in a file for quick reference

Madza
The Startup
5 min readOct 22, 2020

Title Image

Here I have hand-picked some of the most useful code snippets from 30 seconds of code. It’s an awesome resource, go ahead and show it some love.

In this article I tried to sort them based on their practical use, answering common questions you may face in your project:

1.How to hide all elements specified?

const hide = (...el) => [...el].forEach(e => (e.style.display = 'none'));

// Example
hide(document.querySelectorAll('img')); // Hides all <img> elements on the page

2.How to check if the element has the specified class?

const hasClass = (el, className) => el.classList.contains(className);

// Example
hasClass(document.querySelector('p.special'), 'special'); // true

3.How to toggle a class for an element?

const toggleClass = (el, className) => el.classList.toggle(className);

// Example
toggleClass(document.querySelector('p.special'), 'special');
// The paragraph will not have the 'special' class anymore

4.How to get the scroll position of the current page?

const getScrollPosition = (el = window) => ({
x…

Create an account to read the full story.

The author made this story available to Medium members only.
If you’re new to Medium, create a new account to read this story on us.

Or, continue in mobile web

Already have an account? Sign in

The Startup
The Startup

Published in The Startup

Get smarter at building your thing. Follow to join The Startup’s +8 million monthly readers & +772K followers.

Madza
Madza

Written by Madza

Sharing the latest AI insights, essential tools, and productivity secrets to fuel your career growth!

Responses (4)

Write a response

filesystem operations are node.js not ES6
Why would you not use fetch in 2020?
These are not modern snippets at all…

Better to use fetch instead xmlhttprequest.
Also #9 will not work with latest iOS ipad, phone etc and will give desktop for mobile. Need to use below for it
navigator.maxTouchPoints

These appear only to focus on the DOM. JavaScript extends beyond the browser these days especially in modern contexts. Also file operations are Node based on the os system level not in the browser. These are certainly not modern problems…