Hidden Gems Inside Modern JavaScript

Modern JavaScript isn’t just let, const, 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.