22 Utility Functions To Ace Your JavaScript Coding Interview
Tags: javascript, beginners, codenewbie, webdev
Published: 2021-02-17 05:06:15

##JavaScript Coding Assessment Cheatsheet 2021
<p name="2faa" id="2faa" class="graf graf--p graf-after--h4">One type of JavaScript coding interview question you might encounter will involve you writing 1–2 lines of code for a given question. These questions are usually simple enough to answer in 5 minutes, but sometimes we struggle with them due to the pressure of the interview. These functions will help to prepare for your JavaScript Interviews in 2021.</p><p name="a6b3" id="a6b3" class="graf graf--p graf-after--p">To reduce the pressure at times let’s get prepared ahead of time!</p><figure name="8552" id="8552" class="graf graf--figure graf-after--p"><img class="graf-image" data-image-id="0*undOkOxQpiMNKFyg" data-width="3000" data-height="2000" data-unsplash-photo-id="ETRPjvb0KM0" data-is-featured="true" src="https://cdn-images-1.medium.com/max/800/0*undOkOxQpiMNKFyg"><figcaption class="imageCaption">Photo by <a href="https://unsplash.com/@patrickperkins?utm_source=medium&amp;utm_medium=referral" data-href="https://unsplash.com/@patrickperkins?utm_source=medium&amp;utm_medium=referral" class="markup--anchor markup--figure-anchor" rel="photo-creator noopener" target="_blank">Patrick Perkins</a> on <a href="https://unsplash.com?utm_source=medium&amp;utm_medium=referral" data-href="https://unsplash.com?utm_source=medium&amp;utm_medium=referral" class="markup--anchor markup--figure-anchor" rel="photo-source noopener" target="_blank">Unsplash</a></figcaption></figure><h3 name="5f87" id="5f87" class="graf graf--h3 graf-after--figure">1. Remove Duplicates from an Array</h3><ul class="postList"><li name="923f" id="923f" class="graf graf--li graf-after--h3"><strong class="markup--strong markup--li-strong">Arrays</strong>: these are some handy methods that we can use to remove duplicates from an array.</li></ul><ol class="postList"><li name="38d8" id="38d8" class="graf graf--li graf-after--li"><strong class="markup--strong markup--li-strong">Using lodash</strong></li></ol><pre name="b69c" id="b69c" class="graf graf--pre graf-after--li">let array = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];</pre><pre name="c83f" id="c83f" class="graf graf--pre graf-after--pre">let arrayuniq = _.uniq(array);//<em class="markup--em markup--pre-em">[2, 1, 5, 6, 7, 8, 9, 10]</em></pre><p name="d386" id="d386" class="graf graf--p graf-after--pre">2. <strong class="markup--strong markup--p-strong">Using the filter</strong></p><pre name="f1b3" id="f1b3" class="graf graf--pre graf-after--p">let array = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];</pre><pre name="5379" id="5379" class="graf graf--pre graf-after--pre">let list = array.filter((x, i, a) =&gt; a.indexOf(x) == i);</pre><pre name="173e" id="173e" class="graf graf--pre graf-after--pre">//<em class="markup--em markup--pre-em">[2, 1, 5, 6, 7, 8, 9, 10]</em></pre><p name="9db4" id="9db4" class="graf graf--p graf-after--pre">3. <strong class="markup--strong markup--p-strong">Using Set</strong></p><pre name="1e49" id="1e49" class="graf graf--pre graf-after--p">let array = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];</pre><pre name="c3c3" id="c3c3" class="graf graf--pre graf-after--pre">let setuniq = [...new Set(array)];</pre><pre name="ba37" id="ba37" class="graf graf--pre graf-after--pre">//<em class="markup--em markup--pre-em">[2, 1, 5, 6, 7, 8, 9, 10]</em></pre><h3 name="53be" id="53be" class="graf graf--h3 graf-after--pre">2. Remove Duplicates from Array of Objects</h3><ul class="postList"><li name="f51f" id="f51f" class="graf graf--li graf-after--h3"><strong class="markup--strong markup--li-strong">Arrays of Objects:</strong> these are some handy methods that we can use to remove duplicates from an array of objects.</li></ul><ol class="postList"><li name="5005" id="5005" class="graf graf--li graf-after--li"><strong class="markup--strong markup--li-strong">Using lodash</strong></li></ol><pre name="717f" id="717f" class="graf graf--pre graf-after--li">let users = [</pre><pre name="e8fa" id="e8fa" class="graf graf--pre graf-after--pre">{ id: 1, name: &quot;ted&quot; },</pre><pre name="eb4a" id="eb4a" class="graf graf--pre graf-after--pre">{ id: 1, name: &quot;bob&quot; },</pre><pre name="f558" id="f558" class="graf graf--pre graf-after--pre">{ id: 3, name: &quot;sara&quot; },</pre><pre name="b33c" id="b33c" class="graf graf--pre graf-after--pre">{ id: 4, name: &quot;test&quot; },</pre><pre name="a8c4" id="a8c4" class="graf graf--pre graf-after--pre">{ id: 4, name: &quot;test&quot; },</pre><pre name="7100" id="7100" class="graf graf--pre graf-after--pre">{ id: 5, name: &quot;abc&quot; }</pre><pre name="095b" id="095b" class="graf graf--pre graf-after--pre">];</pre><pre name="cfd9" id="cfd9" class="graf graf--pre graf-after--pre">let uniqueUsersByID = _.uniqBy(users, &quot;id&quot;);</pre><pre name="f5df" id="f5df" class="graf graf--pre graf-after--pre">//[{&quot;id&quot;:1,&quot;name&quot;:&quot;ted&quot;},{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;},{&quot;id&quot;:4,&quot;name&quot;:&quot;test&quot;},{&quot;id&quot;:5,&quot;name&quot;:&quot;abc&quot;}]</pre><p name="c702" id="c702" class="graf graf--p graf-after--pre"><em class="markup--em markup--p-em">We can check unique data with multiple properties with this code.</em></p><pre name="9fd2" id="9fd2" class="graf graf--pre graf-after--p">const uniquewithMultipleProperties = _.uniqWith(<br>    users,<br>    (a, b) =&gt; a.id === b.id || a.name === b.name<br>);<br>//[{&quot;id&quot;:1,&quot;name&quot;:&quot;ted&quot;},{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;},{&quot;id&quot;:4,&quot;name&quot;:&quot;test&quot;},{&quot;id&quot;:5,&quot;name&quot;:&quot;abc&quot;}]</pre><p name="ea04" id="ea04" class="graf graf--p graf-after--pre">2. <strong class="markup--strong markup--p-strong">Using a filter</strong></p><pre name="5572" id="5572" class="graf graf--pre graf-after--p">let filteruniquebyID = users.filter(<br>    (v, i, a) =&gt; a.findIndex(t =&gt; t.id === v.id) === i<br>);<br>//[{&quot;id&quot;:1,&quot;name&quot;:&quot;ted&quot;},{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;},{&quot;id&quot;:4,&quot;name&quot;:&quot;test&quot;},{&quot;id&quot;:5,&quot;name&quot;:&quot;abc&quot;}]</pre><p name="4b58" id="4b58" class="graf graf--p graf-after--pre"><em class="markup--em markup--p-em">We can check unique data with multiple properties with this code.</em></p><pre name="9791" id="9791" class="graf graf--pre graf-after--p">let filteruniquebyIDName = users.filter(<br>    (v, i, a) =&gt; a.findIndex(t =&gt; t.id === v.id || t.name === v.name) === i<br>);<br>//[{&quot;id&quot;:1,&quot;name&quot;:&quot;ted&quot;},{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;},{&quot;id&quot;:4,&quot;name&quot;:&quot;test&quot;},{&quot;id&quot;:5,&quot;name&quot;:&quot;abc&quot;}]</pre><p name="50d7" id="50d7" class="graf graf--p graf-after--pre">3. <strong class="markup--strong markup--p-strong">Using Set</strong></p><pre name="858b" id="858b" class="graf graf--pre graf-after--p">var set1 = Array.from(</pre><pre name="64fa" id="64fa" class="graf graf--pre graf-after--pre">users.reduce((m, t) =&gt; m.set(t.id, t), new Map()).values()</pre><pre name="9486" id="9486" class="graf graf--pre graf-after--pre">);</pre><pre name="7a9a" id="7a9a" class="graf graf--pre graf-after--pre">//[{&quot;id&quot;:1,&quot;name&quot;:&quot;bob&quot;},{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;},{&quot;id&quot;:4,&quot;name&quot;:&quot;test&quot;},{&quot;id&quot;:5,&quot;name&quot;:&quot;abc&quot;}]</pre><p name="e366" id="e366" class="graf graf--p graf-after--pre">You can check stackblitz here.</p><p name="633b" id="633b" class="graf graf--p graf-after--p"><a href="https://stackblitz.com/edit/remove-duplicates-arrayofobjects" data-href="https://stackblitz.com/edit/remove-duplicates-arrayofobjects" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">https://stackblitz.com/edit/remove-duplicates-arrayofobjects</a></p><h3 name="c8bc" id="c8bc" class="graf graf--h3 graf-after--p">3. Find an item in Array</h3><ul class="postList"><li name="800b" id="800b" class="graf graf--li graf-after--h3">below are some methods to find an item in the array</li></ul><ol class="postList"><li name="79e0" id="79e0" class="graf graf--li graf-after--li"><strong class="markup--strong markup--li-strong">includes: </strong>this method determines whether an array includes a certain value among its entries, returning <code class="markup--code markup--li-code">true</code> or <code class="markup--code markup--li-code">false</code> as appropriate.</li></ol><pre name="3c52" id="3c52" class="graf graf--pre graf-after--li">console.log(array.includes(2)); // returns true</pre><p name="4fe6" id="4fe6" class="graf graf--p graf-after--pre">2. <strong class="markup--strong markup--p-strong">every: </strong>this method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.</p><pre name="b7ad" id="b7ad" class="graf graf--pre graf-after--p">let testevery1 = array.every(val=&gt; val&gt;3); //false</pre><p name="8c3f" id="8c3f" class="graf graf--p graf-after--pre">3. <strong class="markup--strong markup--p-strong">some: </strong>this method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value.</p><pre name="ed61" id="ed61" class="graf graf--pre graf-after--p">let testsome1 = array.some(val=&gt; val&gt;3); //true</pre><p name="5a0f" id="5a0f" class="graf graf--p graf-after--pre">4.<strong class="markup--strong markup--p-strong"> lodash includes:</strong> checks if <code class="markup--code markup--p-code">value</code> is in <code class="markup--code markup--p-code">collection</code> .Returns <code class="markup--code markup--p-code">true</code> if <code class="markup--code markup--p-code">value</code> is found, else <code class="markup--code markup--p-code">false</code>.</p><pre name="8721" id="8721" class="graf graf--pre graf-after--p">let lodashtest9 =_.includes(array, 1); // true</pre><pre name="58f3" id="58f3" class="graf graf--pre graf-after--pre">let lodashtest10 =_.includes(array, 3, 2); // false</pre><p name="4116" id="4116" class="graf graf--p graf-after--pre">5. <strong class="markup--strong markup--p-strong">findIndex: </strong>this<strong class="markup--strong markup--p-strong"> </strong>method returns the <strong class="markup--strong markup--p-strong">index</strong> of the first element in the array <strong class="markup--strong markup--p-strong">that satisfies the provided testing function</strong>. Otherwise, it returns <code class="markup--code markup--p-code">-1</code>, indicating that no element passed the test.</p><pre name="3bbc" id="3bbc" class="graf graf--pre graf-after--p">let  testindex = array.findIndex(val =&gt; val &gt; 1);<br>//0</pre><p name="7869" id="7869" class="graf graf--p graf-after--pre">6.<strong class="markup--strong markup--p-strong"> find: </strong>this method returns the value of the first element in the provided array that satisfies the provided testing function. If no values satisfy the testing function, <code class="markup--code markup--p-code"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" data-href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" class="markup--anchor markup--p-anchor" rel="noopener nofollow noopener" target="_blank">undefined</a></code> are returned.</p><pre name="dd26" id="dd26" class="graf graf--pre graf-after--p">let testfind = array.find(el =&gt; (el &gt; 2));<br>//5</pre><p name="c4f6" id="c4f6" class="graf graf--p graf-after--pre"><strong class="markup--strong markup--p-strong">7. filter: </strong>this<strong class="markup--strong markup--p-strong"> </strong>method <strong class="markup--strong markup--p-strong">creates a new array</strong> with all elements that pass the test implemented by the provided function.</p><pre name="3a7d" id="3a7d" class="graf graf--pre graf-after--p">let testfilter1 = array.filter(val=&gt; val&gt;3);<br>//<em class="markup--em markup--pre-em">[5, 6, 7, 8, 9, 9, 10]</em></pre><p name="9ba7" id="9ba7" class="graf graf--p graf-after--pre">8. <strong class="markup--strong markup--p-strong">map: </strong>this method <strong class="markup--strong markup--p-strong">creates a new array</strong> populated with the results of calling a provided function on every element in the calling array.</p><pre name="3fab" id="3fab" class="graf graf--pre graf-after--p">let val = [];<br>array.map(item =&gt; { if(item &gt;= 3) val.push(item); });<br>//<em class="markup--em markup--pre-em">[5, 6, 7, 8, 9, 9, 10]</em></pre><p name="3dcd" id="3dcd" class="graf graf--p graf-after--pre">You can check stackblitz here.</p><p name="b7c7" id="b7c7" class="graf graf--p graf-after--p"><a href="https://stackblitz.com/edit/find-item-array" data-href="https://stackblitz.com/edit/find-item-array" class="markup--anchor markup--p-anchor" rel="nofollow noopener" target="_blank">https://stackblitz.com/edit/find-item-array</a></p><h3 name="355a" id="355a" class="graf graf--h3 graf-after--p">4. Find an item in the Array of Objects</h3><ul class="postList"><li name="76fc" id="76fc" class="graf graf--li graf-after--h3">these are the methods that can be used to find an item in the array of objects.</li></ul><p name="e633" id="e633" class="graf graf--p graf-after--li">1. <strong class="markup--strong markup--p-strong">every: </strong>this method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.</p><pre name="1507" id="1507" class="graf graf--pre graf-after--p">let testevery2 = users.every(val=&gt; val.id&gt;3);<br>//false</pre><p name="3411" id="3411" class="graf graf--p graf-after--pre">2. <strong class="markup--strong markup--p-strong">some: </strong>this method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value.</p><pre name="d417" id="d417" class="graf graf--pre graf-after--p">let testsome2 = users.some(val=&gt; val.id&gt;3); //true</pre><p name="1612" id="1612" class="graf graf--p graf-after--pre">3.<strong class="markup--strong markup--p-strong"> lodash includes:</strong> checks if <code class="markup--code markup--p-code">value</code> is in <code class="markup--code markup--p-code">collection</code> .Returns <code class="markup--code markup--p-code">true</code> if <code class="markup--code markup--p-code">value</code> is found, else <code class="markup--code markup--p-code">false</code>.</p><pre name="63e4" id="63e4" class="graf graf--pre graf-after--p">let lodashtest11 =_.includes({ &#39;a&#39;: 1, &#39;b&#39;: 2 }, 1);<br>//true<br>let lodashtest12 =_.includes(&#39;abcd&#39;, &#39;bc&#39;);<br>//true</pre><p name="3f1d" id="3f1d" class="graf graf--p graf-after--pre">4. <strong class="markup--strong markup--p-strong">findIndex: </strong>this<strong class="markup--strong markup--p-strong"> </strong>method returns the <strong class="markup--strong markup--p-strong">index</strong> of the first element in the array <strong class="markup--strong markup--p-strong">that satisfies the provided testing function</strong>. Otherwise, it returns <code class="markup--code markup--p-code">-1</code>, indicating that no element passed the test.</p><pre name="be6b" id="be6b" class="graf graf--pre graf-after--p">let  testindex2 = users.findIndex(val =&gt; val.id &gt; 1);<br>//3</pre><p name="6157" id="6157" class="graf graf--p graf-after--pre">5.<strong class="markup--strong markup--p-strong"> find: </strong>this method returns the value of the first element in the provided array that satisfies the provided testing function. If no values satisfy the testing function, <code class="markup--code markup--p-code"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" data-href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" class="markup--anchor markup--p-anchor" rel="noopener nofollow noopener noopener" target="_blank">undefined</a></code> are returned.</p><pre name="2717" id="2717" class="graf graf--pre graf-after--p">let testfind2 = users.find(el =&gt; (el.id &gt; 2));<br>//{&quot;id&quot;:3,&quot;name&quot;:&quot;sara&quot;}</pre><p name="efa9" id="efa9" class="graf graf--p graf-after--pre"><strong class="markup--strong markup--p-strong">6. filter: </strong>this<strong class="markup--strong markup--p-strong"> </strong>method <strong class="markup--strong markup--p-strong">creates a new array</strong> with all elements that pass the test implemented by the provided function.</p><pre name="dedf" id="dedf" class="graf graf--pre graf-after--p">let testfilter2 = users.filter(val=&gt; val.id&gt;3);</pre><p name="4dd9" id="4dd9" class="graf graf--p graf-after--pre">7. <strong class="markup--strong markup--p-strong">map: </strong>this method <strong class="markup--strong markup--p-strong">creates a new array</strong> populated with the results of calling a provided function on every element in the calling array.</p><pre name="8a66" id="8a66" class="graf graf--pre graf-after--p">let val2 = [];</pre><pre name="bf7c" id="bf7c" class="graf graf--pre graf-after--pre">users.map(item =&gt; { if(item.id &gt;= 3) val2.push(item); });</pre><p name="3a5d" id="3a5d" class="graf graf--p graf-after--pre">You can check stackblitz here.</p><p name="b0be" id="b0be" class="graf graf--p graf-after--p"><a href="https://stackblitz.com/edit/find-item-array" data-href="https://stackblitz.com/edit/find-item-array" class="markup--anchor markup--p-anchor" rel="nofollow noopener noopener" target="_blank">https://stackblitz.com/edit/find-item-array</a></p><h3 name="4a40" id="4a40" class="graf graf--h3 graf-after--p">5. Sort Array items</h3><p name="488b" id="488b" class="graf graf--p graf-after--h3">Arrays can be sort using the sort method.</p><p name="4cbf" id="4cbf" class="graf graf--p graf-after--p">The <code class="markup--code markup--p-code"><strong class="markup--strong markup--p-strong">sort()</strong></code> method sorts the elements of an array <a href="https://en.wikipedia.org/wiki/In-place_algorithm" data-href="https://en.wikipedia.org/wiki/In-place_algorithm" class="markup--anchor markup--p-anchor" rel="noopener" target="_blank"><em class="markup--em markup--p-em">in place</em></a> and returns the sorted array. The default sort order is ascending, built upon converting the elements into strings, then comparing their sequences of UTF-16 code unit values.</p><pre name="7a8b" id="7a8b" class="graf graf--pre graf-after--p">const months = [&#39;March&#39;, &#39;Jan&#39;, &#39;Feb&#39;, &#39;Dec&#39;];<br>months.sort();<br>console.log(months);<br>// expected output: Array [&quot;Dec&quot;, &quot;Feb&quot;, &quot;Jan&quot;, &quot;March&quot;]</pre><pre name="a98c" id="a98c" class="graf graf--pre graf-after--pre">const array1 = [1, 30, 4, 21, 100000];<br>array1.sort();<br>console.log(array1);<br>// expected output: Array [1, 100000, 21, 30, 4]</pre></div></div></div></section>
</section>
##[Continue reading on Medium »](https://medium.com/javascript-in-plain-english/22-utility-functions-to-ace-your-javascript-coding-interview-21ca676ad70)
</article></body></html>