Javascript snippets you need to know right now 🔥 - #5
Tags: javascript, webdev, programming, beginners
Published: 2021-12-08 09:29:04

Hello and how are you doing? 
Hope you guys are doing great. As you know, I started a series of 50 beneficial and useful JS snippets where I would give you 10 every week. After the beautiful response on the previous posts of this series with 3k+ views, I thank you all for supporting me along this way. 
This started with a tweet of mine, so if you aren't following me on twitter, please do so!

{% tweet 1456165753359527938 %} 
***
### Let's get started

1️⃣ flatten
This snippet flattens an array up to a specified depth using recursion.
```js
const flatten = (arr, depth = 1) =>
  arr.reduce((a, v) => a.concat(depth > 1 && Array.isArray(v) ? flatten(v, depth - 1) : v), []);

flatten([1, [2], 3, 4]); // [1, 2, 3, 4]
flatten([1, [2, [3, [4, 5], 6], 7], 8], 2); // [1, 2, 3, [4, 5], 6, 7, 8]
```
2️⃣ forEachRight
This snippet executes a function for each element of an array starting from the array’s last element.
```js
const forEachRight = (arr, callback) =>
  arr
    .slice(0)
    .reverse()
    .forEach(callback);
    
forEachRight([1, 2, 3, 4], val => console.log(val)); // '4', '3', '2', '1'
```
3️⃣ forOwn
This snippet iterates on each property of an object and iterates a callback for each one respectively.
```js
const forOwn = (obj, fn) => Object.keys(obj).forEach(key => fn(obj[key], key, obj));
forOwn({ foo: 'bar', a: 1 }, v => console.log(v)); // 'bar', 1
```
4️⃣ Get Time From Date
This snippet can be used to get the time from a Dateobject as a string.
```js
const getColonTimeFromDate = date => date.toTimeString().slice(0, 8);

getColonTimeFromDate(new Date()); // "08:38:00"
```
5️⃣ Get Days Between Dates
This snippet can be used to find the difference in days between two dates.
```js
const getDaysDiffBetweenDates = (dateInitial, dateFinal) =>
  (dateFinal - dateInitial) / (1000 * 3600 * 24);
  
getDaysDiffBetweenDates(new Date('2019-01-13'), new Date('2019-01-15')); // 2
```
6️⃣ getStyle
This snippet can be used to get the value of a CSS rule for a particular element.
```js
const getStyle = (el, ruleName) => getComputedStyle(el)[ruleName];

getStyle(document.querySelector('p'), 'font-size'); // '16px'
```
7️⃣ getType
This snippet can be used to get the type of a value.
```js
const getType = v =>
  v === undefined ? 'undefined' : v === null ? 'null' : v.constructor.name.toLowerCase();
  
getType(new Set([1, 2, 3])); // 'set'
```
8️⃣ hasClass
This snippet checks whether an element has a particular class.
```js
const hasClass = (el, className) => el.classList.contains(className);
hasClass(document.querySelector('p.special'), 'special'); // true
```
9️⃣ head
This snippet returns the head of a list.
```js
const head = arr => arr[0];

head([1, 2, 3]); // 1
```
🔟 hide
This snippet can be used to hide all elements specified.
```js
const hide = (...el) => [...el].forEach(e => (e.style.display = 'none'));

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

***

### Thank you for reading!

Do follow me on [Twitter](https://twitter.com/rainboestrykr), I'll be creating awesome tech content over there soon. 
Subscribe to my newsletter to never miss out on tech news, product launches and my top blogposts. 

[Subscribe here](https://www.getrevue.co/profile/abhiraj)

'Til next time
[Abhiraj](https://abhiraj.glitch.me)