softare development

Hidden Gems Inside Modern JavaScript

Modern JavaScript isn’t just letconst, arrow functions, and promises anymore. Over the years, the language has quietly grown a set of powerful “hidden gems” — features that many developers either overlook or never fully explore, yet they can dramatically improve code clarity, performance, and expressiveness.

Here are some of the most underrated features hiding in plain sight inside modern JavaScript.

1. Nullish Coalescing (??)

Most developers rely on || for default values, but that can be dangerous.

const name = user.name || "Guest";

This treats 0, false, and “” as “missing values,” which is often wrong.

Enter the nullish coalescing operator:

const name = user.name ?? "Guest";

Now it only falls back when the value is null or undefined. Much safer and more precise.

2. Optional Chaining (?.)

Deep object access used to be a nightmare:

const city = user && user.address && user.address.city;

Now:

const city = user?.address?.city;

If anything in the chain is missing, JavaScript safely returns undefined instead of throwing an error.

This is one of the most practical modern JavaScript upgrades.

3. Dynamic Import()

Instead of loading everything upfront, you can load code only when needed.

const module = await import("./analytics.js");
module.trackEvent();

This is powerful for performance optimization, especially in large apps where bundle size matters.

Think of it as “lazy loading for logic.”

4. Object.fromEntries()

You probably know Object.entries():

const arr = [["name", "John"], ["age", 25]];

But the reverse is often ignored:

const obj = Object.fromEntries(arr);

This becomes extremely useful when transforming data:

const filtered = Object.fromEntries(
  Object.entries(user).filter(([key]) => key !== "password")
);

5. BigInt (Safe Large Numbers)

JavaScript numbers break past 2^53 - 1.

const big = 9007199254740991n;

The n suffix creates a BigInt.

You can now safely handle very large integers used in finance, cryptography, and databases.

6. Array.at()

Negative indexing used to require hacks:

const last = arr[arr.length - 1];

Now:

const last = arr.at(-1);

Cleaner, more readable, and less error-prone.

7. Structured Clone (Deep Copy Done Right)

Copying objects used to be messy:

const copy = JSON.parse(JSON.stringify(obj));

But this breaks functions, dates, maps, etc.

Now:

const copy = structuredClone(obj);

It properly clones complex data structures without hacks.

8. Top-Level Await

In ES modules, you can now use await outside functions:

const data = await fetch("https://api.example.com/data");

This simplifies module initialization and avoids unnecessary async wrappers.

9. Private Class Fields

Encapsulation used to rely on conventions like _privateVar.

Now JavaScript enforces it:

class BankAccount {
  #balance = 0;

  deposit(amount) {
    this.#balance += amount;
  }
}

Anything with # is truly private — inaccessible outside the class.

10. Promise.allSettled()

Unlike Promise.all(), which fails fast, this waits for everything:

const results = await Promise.allSettled([
  fetch("/api/users"),
  fetch("/api/orders"),
]);

You get success and failure results together — perfect for dashboards and batch operations.

Final Thoughts

Modern JavaScript is no longer just a scripting language — it’s a full-scale engineering tool with layers of hidden power. Most developers only use the “surface syntax,” but these lesser-known features unlock:

  • Cleaner code
  • Safer logic
  • Better performance
  • More expressive patterns

Mastering these hidden gems doesn’t just make you a better JavaScript developer — it changes how you design applications entirely.

Recent Posts

Software Developer Pain Points Ranked: What Frustrates Developers the Most?

Software development is one of the most rewarding careers in technology, but it is also…

17 hours ago

How to Print Documents in JavaScript

Printing a document in JavaScript usually means triggering the browser’s print dialog and controlling what…

3 days ago

CSS Display Cheatsheet

The display property controls how an element behaves in the layout and how its children are arranged. Access software…

7 days ago

10 JavaScript Habits Destroying Your Code

JavaScript is one of the most flexible programming languages ever created. That flexibility is powerful,…

1 week ago

Linux Steam Locomotive Bash program

What is Steam Locomotive (sl)? Steam Locomotive (sl) is a small terminal program on Unix/Linux systems…

2 months ago

Rate Limiting in Node JS

What is Rate Limiting? Download this article as a PDF on the Codeflare Mobile App…

2 months ago