The latest articles on DEV Community by John (@johnc). https://dev.to/johnc https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1220849%2F9dd61e62-8836-45ad-a937-05aa31eb62ac.png https://dev.to/johnc en John Wed, 27 Dec 2023 09:46:59 +0000 https://dev.to/johnc/day-14-30-days-learn-web-dev-53kd https://dev.to/johnc/day-14-30-days-learn-web-dev-53kd <p><strong>21 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/group-by">2631. Group By</a><br> <a href="https://leetcode.com/problems/sort-by">2724. Sort By</a></p> <p><strong>What I learn:</strong></p> <ul> <li>How to use <code>Array.sort()</code> </li> </ul> javascript beginners programming John Wed, 20 Dec 2023 12:30:22 +0000 https://dev.to/johnc/day-13-30-days-learn-web-dev-e79 https://dev.to/johnc/day-13-30-days-learn-web-dev-e79 <p><strong>20 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/chunk-array">2677. Chunk Array</a><br> <a href="https://leetcode.com/problems/array-prototype-last">2619. Array Prototype Last</a></p> javascript programming beginners John Wed, 20 Dec 2023 12:27:11 +0000 https://dev.to/johnc/day-12-30-days-learn-web-dev-4m14 https://dev.to/johnc/day-12-30-days-learn-web-dev-4m14 <p><strong>19 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/is-object-empty/">2727. Is Object Empty</a></p> <p><strong>What I learn:</strong></p> <ul> <li>Object.keys()</li> </ul> javascript programming beginners John Tue, 19 Dec 2023 12:45:34 +0000 https://dev.to/johnc/day-11-30-days-learn-web-dev-1kg4 https://dev.to/johnc/day-11-30-days-learn-web-dev-1kg4 <p><strong>18 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/execute-asynchronous-functions-in-parallel/">2721. Execute Asynchronous Functions in Parallel</a></p> <p><strong>What I learn:</strong></p> <ul> <li>How to emulate Promise.all()</li> <li>For arrays, the length property returns the highest numeric index plus one. </li> </ul> <div class="highlight js-code-highlight"> <pre class="highlight javascript"><code><span class="kd">let</span> <span class="nx">arr</span> <span class="o">=</span> <span class="p">[];</span> <span class="nx">arr</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span> <span class="nx">arr</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="c1">// return 2</span> </code></pre> </div> javascript programming beginners John Thu, 14 Dec 2023 10:48:23 +0000 https://dev.to/johnc/day-10-30-days-learn-web-dev-4c9 https://dev.to/johnc/day-10-30-days-learn-web-dev-4c9 <p><strong>14 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/debounce">2627. Debounce</a></p> <p><strong>What I learn:</strong></p> <ul> <li>What is Debounce in Javascript and its usage.</li> <li>It is guaranteed that a <code>timeoutID</code> value will never be reused by a subsequent call to <code>setTimeout()</code> or <code>setInterval()</code> on the same object (a window or a worker).</li> </ul> <p>Fun fact: we can use <code>clearTimeout()</code> and <code>clearInterval()</code> interchangeably.</p> javascript programming beginners John Wed, 13 Dec 2023 08:48:36 +0000 https://dev.to/johnc/day-9-30-days-learn-web-dev-kfm https://dev.to/johnc/day-9-30-days-learn-web-dev-kfm <p><strong>12 Dec 2023</strong></p> <p><strong>Finished:</strong><br> <a href="https://leetcode.com/problems/cache-with-time-limit/description">2622. Cache With Time Limit</a></p> <p><strong>What I learn:</strong></p> <ul> <li>How to implement Cache With Time Limit</li> <li>There is only Arrays, Set, Map has built-in support. There is no list, tree, stack, etc...</li> </ul> javascript programming beginners John Mon, 11 Dec 2023 09:32:52 +0000 https://dev.to/johnc/day-8-30-days-learn-web-dev-48j0 https://dev.to/johnc/day-8-30-days-learn-web-dev-48j0 <p><strong>7 Dec 2023</strong></p> <p>Finished: <br> <a href="https://leetcode.com/problems/interval-cancellation/">2725. Interval Cancellation</a><br> <a href="https://leetcode.com/problems/promise-time-limit/">2637. Promise Time Limit</a></p> <p><strong>What I learn:</strong></p> <ul> <li>enhance a promise with time limit</li> </ul> <p>Interval related:</p> <ol> <li><code>setInterval()</code></li> <li>ensure that execution duration is shorter than interval frequency</li> <li>clear interval with <code>clearInterval(id)</code> </li> </ol> <p>Timeout related:</p> <ol> <li>clear timeout with <code>clearTimeout(id)</code> </li> <li>recursive <code>setTimeout()</code> pattern approach</li> </ol> javascript programming beginners John Wed, 06 Dec 2023 18:11:29 +0000 https://dev.to/johnc/day-7-30-days-learn-web-dev-2mkh https://dev.to/johnc/day-7-30-days-learn-web-dev-2mkh <p><strong>6 Dec 2023</strong></p> <p><strong>What I learn:</strong></p> <ul> <li>the function provide to <code>.then()</code> always run asynchronously.</li> </ul> javascript beginners programming John Tue, 05 Dec 2023 20:11:02 +0000 https://dev.to/johnc/day-6-30-days-learn-web-dev-14c5 https://dev.to/johnc/day-6-30-days-learn-web-dev-14c5 <p><strong>5 Dec 2023</strong></p> <p><strong>What I learn:</strong></p> <ul> <li>the difference of <code>return</code>, <code>return await</code> in async function.</li> </ul> javascript programming beginners John Mon, 04 Dec 2023 11:28:19 +0000 https://dev.to/johnc/day-5-30-days-learn-web-dev-l36 https://dev.to/johnc/day-5-30-days-learn-web-dev-l36 <p><strong>4 Dec 2023</strong></p> <p>Finished <a href="https://leetcode.com/problems/sleep/">2621. Sleep</a></p> <p><strong>What I learn:</strong></p> <ul> <li>Promises</li> <li>setTimeout() return a timeoutID</li> <li><code>clearTimeout(timeoutID)</code></li> <li>.finally() in promise</li> <li>JavaScript's Event Loop</li> <li>we can use promise chaining to avoid "callback hell" or "pyramid of doom"</li> <li>we can write asynchronous code that almost looks like synchronous code with the assistance of async and await, it is easier to understand and maintain</li> </ul> javascript programming beginners John Fri, 01 Dec 2023 13:42:08 +0000 https://dev.to/johnc/day-4-30-days-learn-web-dev-5ee8 https://dev.to/johnc/day-4-30-days-learn-web-dev-5ee8 <p><strong>1 Dec 2023</strong></p> <p>Finished <a href="https://leetcode.com/problems/add-two-promises/">2723. Add Two Promises</a></p> <p><strong>What I learn:</strong></p> <ul> <li>Promise.all()</li> <li>Promise.allSettled()</li> <li>promise start executing at creation.</li> </ul> javascript beginners programming John Fri, 01 Dec 2023 06:58:47 +0000 https://dev.to/johnc/day-3-30-days-learn-web-dev-5f3k https://dev.to/johnc/day-3-30-days-learn-web-dev-5f3k <p><strong>30 Nov 2023</strong></p> <p><a href="https://leetcode.com/problems/memoize/">Finished leetcode 2623. Memoize</a></p> <p><strong>What I learn:</strong><br> We can construct custom string to be the key of the value in object/array, its very free.</p> javascript programming beginners