Avoid using toBeTruthy() and toBeFalsy() matchers

Test assertions should be explicit. If I’m trying to assert that something should be true I avoid using the toBeTruthy() matcher. It’s important to realize that in JavaScript, all values are truthy unless they are defined as falsy. This means that as long as result is not a falsy value (e.g. false, "", null, undefined, NaN, etc.), the assertion will pass. expect(result).toBeTruthy() // passes if result is {} or [] or 1 Contrast it with this approach where result will only pass if its value is true....

1 min · Jesstern Rays

Check if a variable is null or undefined in JavaScript

Use double question mark operator to check if a variable is null or undefined in JavaScript

2 min · Jesstern Rays

Create an array from range of numbers

How to create an array of elements based on a range of numbers in JavaScript

2 min · Jesstern Rays

Difference between for...of and for...in in JavaScript

for...of is for arrays The for...of statement iterates over values of an iterable (e.g. String, Array, Set, Map). If we have 10 apples and we have 1 of them, we might say 1 of 10 apples. That’s one way to remember that for...of is for arrays. const array = ['a', 'b', 'c'] for (const element of array) { // element => 'a', 'b', 'c' } for...in is for objects The for....

1 min · Jesstern Rays

Implementing a frontend search functionality

Let’s say we have an online bookstore where we list all our available books. We want to be able to implement a search bar that can filter out results that match the title, author, publisher, etc. Solutions like Algolia, Solr, or Elasticsearch are non-trivial solutions that require quite a bit of configuration and resources. These solutions may also be overkill if you have a small to moderately large dataset. We can look at Fuse....

1 min · Jesstern Rays

Iterate over an array in JavaScript

Using for...of This is the simplest approach to iterate over an array while still allowing you to break out of the loop. Do not confuse with for...in which is for iterating over objects. for (const element of array) { // your code here } Using a for loop This is the most versatile approach as it allows you to control the starting index, increment value, range, etc. Use this approach if you’re not doing a straightforward iteration over an array....

1 min · Jesstern Rays

Merging arrays in JavaScript without duplicates

How to merge two or more arrays in JavaScript

2 min · Jesstern Rays

React Query

Fetch, cache and update data in React applications

1 min · Jesstern Rays

Run JavaScript and TypeScript with RunJS

Often times I find myself wanting to run a bit of JavaScript code to check if it’s working properly. I do this with my notes or when I’m trying to understand something I’ve read online. Typically, I would use the console on my browser, but that has its limitations. There are also online tools like JSFiddle, CodePen, and Replit. However, these tools tend to be geared towards frontend development with HTML and CSS, and some even require you to login just to use their service....

1 min · Jesstern Rays

Run Jest tests that match a describe block

How to run tests that only match the name in the describe block

1 min · Jesstern Rays