Travis build: 402
This commit is contained in:
30secondsofcode
@ -205,7 +205,7 @@ hub<span class="token punctuation">.</span><span class="token function">off</spa
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">insertBefore</span><span class="token punctuation">(</span>document<span class="token punctuation">.</span><span class="token function">getElementById</span><span class="token punctuation">(</span><span class="token string">'myId'</span><span class="token punctuation">),</span> <span class="token string">'<p>before</p>'</span><span class="token punctuation">);</span> <span class="token comment">// <p>before</p> <div id="myId">...</div></span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="isbrowsertabfocused">isBrowserTabFocused</h4><p>Returns <code>true</code> if the browser tab of the page is focused, <code>false</code> otherwise.</p><p>Use the <code>Document.hidden</code> property, introduced by the Page Visibility API to check if the browser tab of the page is visible or hidden.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">isBrowserTabFocused</span> <span class="token operator">=</span> <span class="token punctuation">()</span> <span class="token operator">=> !</span>document<span class="token punctuation">.</span>hidden<span class="token punctuation">;</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">isBrowserTabFocused</span><span class="token punctuation">();</span> <span class="token comment">// true</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="nodelisttoarray">nodeListToArray</h4><p>Converts a <code>NodeList</code> to an array.</p><p>Use <code>Array.prototype.slice()</code> and <code>Function.prototype.call()</code> to convert a <code>NodeList</code> to an array.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">nodeListToArray</span> <span class="token operator">=</span> nodeList <span class="token operator">=></span> Array<span class="token punctuation">.</span>prototype<span class="token punctuation">.</span>slice<span class="token punctuation">.</span><span class="token function">call</span><span class="token punctuation">(</span>nodeList<span class="token punctuation">);</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="nodelisttoarray">nodeListToArray</h4><p>Converts a <code>NodeList</code> to an array.</p><p>Use spread operator inside new array to convert a <code>NodeList</code> to an array.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">nodeListToArray</span> <span class="token operator">=</span> nodeList <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token operator">...</span>nodeList<span class="token punctuation">];</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">nodeListToArray</span><span class="token punctuation">(</span>document<span class="token punctuation">.</span>childNodes<span class="token punctuation">);</span> <span class="token comment">// [ <!DOCTYPE html>, html ]</span>
|
||||
</pre></div><div class="card code-card"><div class="corner advanced">advanced</div><div class="section card-content"><h4 id="observemutations">observeMutations</h4><p>Returns a new MutationObserver and runs the provided callback for each mutation on the specified element.</p><p>Use a <a href="https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver"><code>MutationObserver</code></a> to observe mutations on the given element. Use <code>Array.forEach()</code> to run the callback for each mutation that is observed. Omit the third argument, <code>options</code>, to use the default <a href="https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver#MutationObserverInit">options</a> (all <code>true</code>).</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">observeMutations</span> <span class="token operator">=</span> <span class="token punctuation">(</span>element<span class="token punctuation">,</span> callback<span class="token punctuation">,</span> options<span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">const</span> observer <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">MutationObserver</span><span class="token punctuation">(</span>mutations <span class="token operator">=></span> mutations<span class="token punctuation">.</span><span class="token function">forEach</span><span class="token punctuation">(</span>m <span class="token operator">=></span> <span class="token function">callback</span><span class="token punctuation">(</span>m<span class="token punctuation">)));</span>
|
||||
|
||||
@ -218,7 +218,7 @@
|
||||
};</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">intersection</span><span class="token punctuation">([</span><span class="token number">1</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">3</span><span class="token punctuation">], [</span><span class="token number">4</span><span class="token punctuation">,</span> <span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">]);</span> <span class="token comment">// [2,3]</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="intersectionby">intersectionBy</h4><p>Returns a list of elements that exist in both arrays, after applying the provided function to each array element of both.</p><p>Create a <code>Set</code> by applying <code>fn</code> to all elements in <code>b</code>, then use <code>Array.filter()</code> on <code>a</code> to only keep elements, which produce values contained in <code>b</code> when <code>fn</code> is applied to them.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">intersectionBy</span> <span class="token operator">=</span> <span class="token punctuation">(</span>a<span class="token punctuation">,</span> b<span class="token punctuation">,</span> fn<span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">const</span> s <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Set</span><span class="token punctuation">(</span>b<span class="token punctuation">.</span><span class="token function">map</span><span class="token punctuation">(</span>x <span class="token operator">=></span> <span class="token function">fn</span><span class="token punctuation">(</span>x<span class="token punctuation">)));</span>
|
||||
<span class="token keyword">const</span> s <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Set</span><span class="token punctuation">(</span>b<span class="token punctuation">.</span><span class="token function">map</span><span class="token punctuation">(</span>fn<span class="token punctuation">));</span>
|
||||
<span class="token keyword">return</span> a<span class="token punctuation">.</span><span class="token function">filter</span><span class="token punctuation">(</span>x <span class="token operator">=></span> s<span class="token punctuation">.</span><span class="token function">has</span><span class="token punctuation">(</span><span class="token function">fn</span><span class="token punctuation">(</span>x<span class="token punctuation">)));
|
||||
};</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">intersectionBy</span><span class="token punctuation">([</span><span class="token number">2.1</span><span class="token punctuation">,</span> <span class="token number">1.2</span><span class="token punctuation">], [</span><span class="token number">2.3</span><span class="token punctuation">,</span> <span class="token number">3.4</span><span class="token punctuation">],</span> Math<span class="token punctuation">.</span>floor<span class="token punctuation">);</span> <span class="token comment">// [2.1]</span>
|
||||
|
||||
@ -232,7 +232,7 @@ own individual rating by supplying it as the third argument.
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">randomIntegerInRange</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">5</span><span class="token punctuation">);</span> <span class="token comment">// 2</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="randomnumberinrange">randomNumberInRange</h4><p>Returns a random number in the specified range.</p><p>Use <code>Math.random()</code> to generate a random value, map it to the desired range using multiplication.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">randomNumberInRange</span> <span class="token operator">=</span> <span class="token punctuation">(</span>min<span class="token punctuation">,</span> max<span class="token punctuation">)</span> <span class="token operator">=></span> Math<span class="token punctuation">.</span><span class="token function">random</span><span class="token punctuation">()</span> <span class="token operator">*</span> <span class="token punctuation">(</span>max <span class="token operator">-</span> min<span class="token punctuation">)</span> <span class="token operator">+</span> min<span class="token punctuation">;</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">randomNumberInRange</span><span class="token punctuation">(</span><span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">10</span><span class="token punctuation">);</span> <span class="token comment">// 6.0211363285087005</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="round">round</h4><p>Rounds a number to a specified amount of digits.</p><p>Use <code>Math.round()</code> and template literals to round the number to the specified number of digits. Omit the second argument, <code>decimals</code> to round to an integer.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">round</span> <span class="token operator">=</span> <span class="token punctuation">(</span>n<span class="token punctuation">,</span> decimals <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token function">Number</span><span class="token punctuation">(</span><span class="token template-string"><span class="token string">`${Math.round(`</span></span>$<span class="token punctuation">{</span>n<span class="token punctuation">}</span>e$<span class="token punctuation">{</span>decimals<span class="token punctuation">}</span><span class="token template-string"><span class="token string">`)}e-</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>decimals<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">`</span></span><span class="token punctuation">);</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="round">round</h4><p>Rounds a number to a specified amount of digits.</p><p>Use <code>Math.round()</code> and template literals to round the number to the specified number of digits. Omit the second argument, <code>decimals</code> to round to an integer.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">round</span> <span class="token operator">=</span> <span class="token punctuation">(</span>n<span class="token punctuation">,</span> decimals <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token function">Number</span><span class="token punctuation">(</span><span class="token template-string"><span class="token string">`</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>Math<span class="token punctuation">.</span><span class="token function">round</span><span class="token punctuation">(</span>`$<span class="token punctuation">{</span>n<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">e</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>decimals<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">`</span></span><span class="token punctuation">)}</span>e<span class="token operator">-</span>$<span class="token punctuation">{</span>decimals<span class="token punctuation">}</span>`<span class="token punctuation">);</span>
|
||||
</pre><label class="collapse">examples</label><pre class="section card-examples language-js"><span class="token function">round</span><span class="token punctuation">(</span><span class="token number">1.005</span><span class="token punctuation">,</span> <span class="token number">2</span><span class="token punctuation">);</span> <span class="token comment">// 1.01</span>
|
||||
</pre></div><div class="card code-card"><div class="corner intermediate">intermediate</div><div class="section card-content"><h4 id="sdbm">sdbm</h4><p>Hashes the input string into a whole number.</p><p>Use <code>String.split('')</code> and <code>Array.reduce()</code> to create a hash of the input string, utilizing bit shifting.</p></div><div class="copy-button-container"><button class="copy-button"></button></div><pre class="section card-code language-js"><span class="token keyword">const</span> <span class="token function-variable function">sdbm</span> <span class="token operator">=</span> str <span class="token operator">=></span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">let</span> arr <span class="token operator">=</span> str<span class="token punctuation">.</span><span class="token function">split</span><span class="token punctuation">(</span><span class="token string">''</span><span class="token punctuation">);</span>
|
||||
|
||||
Reference in New Issue
Block a user