Hello my fellow readers!
If you have really come this far in this series of posts, I would like to thank you for your support in reading all of the posts in this series. Thank you and do follow me on Twitter for more tech content soon. Let's get started.
1️⃣ Drop Elements
This snippet returns a new array with n elements removed from the left.
<pre class="highlight javascript">```
<span class="kd">const</span> <span class="nx">drop</span> <span class="o">=</span> <span class="p">(</span><span class="nx">arr</span><span class="p">,</span> <span class="nx">n</span> <span class="o">=</span> <span class="mi">1</span><span class="p">)</span> <span class="o">=></span> <span class="nx">arr</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="nx">n</span><span class="p">);</span>
<span class="nx">drop</span><span class="p">([</span><span class="mi">1</span><span class="p">,</span> <span class="mi">2</span><span class="p">,</span> <span class="mi">3</span><span class="p">]);</span> <span class="c1">// [2,3]</span>
<span class="nx">drop</span><span class="p">([</span><span class="mi">1</span><span class="p">,</span> <span class="mi">2</span><span class="p">,</span> <span class="mi">3</span><span class="p">],</span> <span class="mi">2</span><span class="p">);</span> <span class="c1">// [3]</span>
<span class="nx">drop</span><span class="p">([</span><span class="mi">1</span><span class="p">,</span> <span class="mi">2</span><span class="p">,</span> <span class="mi">3</span><span class="p">],</span> <span class="mi">42</span><span class="p">);</span> <span class="c1">// []</span>
2️⃣ dropRight
This snippet returns a new array with n elements removed from the right.
``` const dropRight = (arr, n = 1) => arr.slice(0, -n); dropRight([1, 2, 3]); // [1,2] dropRight([1, 2, 3], 2); // [1] dropRight([1, 2, 3], 42); // [] ``` ``` 3️⃣ dropRightWhile This snippet removes elements from the right side of an array until the passed function returns true. `````` const dropRightWhile = (arr, func) => { while (arr.length > 0 && !func(arr[arr.length - 1])) arr = arr.slice(0, -1); return arr; }; dropRightWhile([1, 2, 3, 4], n => n < 3); // [1, 2] ``` ``` 4️⃣ dropWhile This snippet removes elements from an array until the passed function returns true. `````` const dropWhile = (arr, func) => { while (arr.length > 0 && !func(arr[0])) arr = arr.slice(1); return arr; }; dropWhile([1, 2, 3, 4], n => n >= 3); // [3,4] ``` ``` 5️⃣ elementContains This snippet checks whether the parent element contains the child. `````` const elementContains = (parent, child) => parent !== child && parent.contains(child); elementContains(document.querySelector('head'), document.querySelector('title')); // true elementContains(document.querySelector('body'), document.querySelector('body')); // false ``` ``` 6️⃣ Filter Duplicate Elements This snippet removes duplicate values in an array. `````` const filterNonUnique = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i)); filterNonUnique([1, 2, 2, 3, 4, 4, 5]); // [1, 3, 5] ``` ``` 7️⃣ findKey This snippet returns the first key that satisfies a given function. `````` const findKey = (obj, fn) => Object.keys(obj).find(key => fn(obj[key], key, obj)); findKey( { barney: { age: 36, active: true }, fred: { age: 40, active: false }, pebbles: { age: 1, active: true } }, o => o['active'] ); // 'barney' ``` ``` 8️⃣ findLast This snippet returns the last element for which a given function returns a truthy value. `````` const findLast = (arr, fn) => arr.filter(fn).pop(); findLast([1, 2, 3, 4], n => n % 2 === 1); // 3 ``` ``` 9️⃣ insertAfter This snippet can be used to insert an HTML string after the end of a particular element. `````` const insertAfter = (el, htmlString) => el.insertAdjacentHTML('afterend', htmlString); insertAfter(document.getElementById('myId'), 'after
'); //...after
``` ``` 🔟 insertBefore This snippet can be used to insert an HTML string before a particular element. `````` const insertBefore = (el, htmlString) => el.insertAdjacentHTML('beforebegin', htmlString); insertBefore(document.getElementById('myId'), 'before
'); //before
...``` ``` Thank you for reading! ------------------------ Subscribe to my newsletter to never miss out on Product Launches and my top posts. [Abhiraj's Dev-letter](https://www.getrevue.co/profile/abhiraj) Until next time, [Abhiraj](https://abhiraj.glitch.me)