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.
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.
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.
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.”
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")
); 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.
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.
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.
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.
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.
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.
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:
Mastering these hidden gems doesn’t just make you a better JavaScript developer — it changes how you design applications entirely.
Latest tech news and coding tips.
Software development is one of the most rewarding careers in technology, but it is also…
Printing a document in JavaScript usually means triggering the browser’s print dialog and controlling what…
The display property controls how an element behaves in the layout and how its children are arranged. Access software…
JavaScript is one of the most flexible programming languages ever created. That flexibility is powerful,…
What is Steam Locomotive (sl)? Steam Locomotive (sl) is a small terminal program on Unix/Linux systems…
What is Rate Limiting? Download this article as a PDF on the Codeflare Mobile App…