JavaScript Tutorials
Sum an Array of Numbers with JavaScript
It's rare that I'm disappointed by the JavaScript language not having a function that I need. One such case was summing an array of numbers -- I was expecting
Math.sum
or a likewise, baked in API. Fear not -- summing an array of numbers...JavaScript waitFor Polling
As more of the JavaScript developers write becomes asynchronous, it's only natural to need to wait for conditions to be met. This is especially true in a world with asynchronous testing of conditions which don't provide an explicit
await
. I've written aboutwaitForever
,waitForTime
...queryLocalFonts
One of the larger downloads when requesting a webpage are custom fonts. There are many great techniques for lazy loading fonts to improve performance for those on poor connections. By getting insight into what fonts the user has available, we can avoid loading custom fonts.
Use XHR/fetch Breakpoints!
Web debugging tools are so incredibly excellent these days. I remember the days where they didn't exist and debugging was a total nightmare, even for the simplest of problems. A while back I introduced many of you to Logpoints, a way to output...
URL.canParse
Parsing of URLs on the client side has been a common practice for two decades. The early days included using illegible regular expressions but the JavaScript specification eventually evolved into a
new URL
method of parsing URLs. WhileURL
is incredibly useful when a valid URL...JavaScript closest
When it comes to finding relationships between elements, we traditionally think of a top-down approach. We can thank CSS and
querySelector
/querySelectorAll
for that relationship in selectors. What if we want to find an element's parent based on selector?To look up the element tree and find...JavaScript: Reverse Arrays
Manipulating data is core to any programming language. JavaScript is no exception, especially as JSON has token over as a prime data delivery format. One such data manipulation is reversing arrays. You may want to reverse an array to show most recent transactions, or...
JavaScript Array Group
Managing, sorting, and manipulating data with JavaScript is a skill we've often delegated to third party libraries like lodash. As the JavaScript language progresses, however, these features eventually get. added to the JavaScript specification. Two such APIs for grouping of
Array
data are `Array.prototype.group
...Detect the Content Type in the Clipboard
A user's clipboard is a "catch all" between the operating system and the apps employed on it. When you use a web browser, you can highlight text or right-click an image and select "Copy Image". That made me think about how developers can detect what is...
fetch with Timeout
A few years back I wrote a blog post about how write a
fetch
Promise that times out. The function was effective but the code wasn't great, mostly becauseAbortController
, which allows you to cancel a fetch Promise, did not yet exist. With...