DEV Community

DCT Technology Pvt. Ltd.
DCT Technology Pvt. Ltd.

Posted on

๐Ÿšจ 7 Hidden JavaScript Features You're Probably Ignoring (And Why That's Slowing You Down)

Letโ€™s face itโ€”JavaScript is HUGE. Even if youโ€™ve been writing it for years, there are features hiding in plain sight that could save you time, reduce bugs, or even make your code cleaner and more fun to write.

But hereโ€™s the thing: most developers arenโ€™t using them.

Why?

Because no one talks about them enough.

So letโ€™s change that.

Here are 7 underrated JavaScript features that deserve a permanent place in your coding toolbox๐Ÿ‘‡

Image description


1. Optional Chaining (?.)

Tired of checking if a deeply nested property exists before accessing it?

// Without optional chaining
if (user && user.profile && user.profile.image) {
  console.log(user.profile.image);
}

// With optional chaining
console.log(user?.profile?.image);

Enter fullscreen mode Exit fullscreen mode

โœ… Clean

โœ… Safer

โœ… Less nesting

๐Ÿ‘‰ MDN Optional Chaining Docs


2. Nullish Coalescing Operator (??)

Stop using || when you actually want to check for null or undefined.

const userName = inputName ?? "Guest";
Enter fullscreen mode Exit fullscreen mode

This avoids unexpected results like '', 0, or false getting replaced.


3. Object Destructuring with Default Values

Youโ€™re probably destructuring, but are you combining it with defaults?

const { name = "Anonymous", age = 25 } = user;
Enter fullscreen mode Exit fullscreen mode

No more:

const name = user.name ? user.name : "Anonymous";
Enter fullscreen mode Exit fullscreen mode

This keeps things tight and readable.


4. Named Capturing Groups in Regex

Regex doesnโ€™t have to look like ancient alien code anymore.

const dateRegex = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
const result = dateRegex.exec("2025-04-07");

console.log(result.groups.year); // '2025'
Enter fullscreen mode Exit fullscreen mode

๐Ÿ’ก Easier to understand

๐Ÿ’ก Easier to maintain

๐Ÿ‘‰ Regex named groups explained


5. Array .at() Method

Access array elements from the end without length - 1 gymnastics.

const arr = [10, 20, 30, 40];
console.log(arr.at(-1)); // 40
Enter fullscreen mode Exit fullscreen mode

Perfect for when you're working with the latest item in a list!

๐Ÿ‘‰ MDN .at() Method


6. Top-Level await (in ES modules)

No need to wrap everything in async IIFEs anymore.

const response = await fetch("https://jsonplaceholder.typicode.com/posts");
const data = await response.json();
console.log(data);
Enter fullscreen mode Exit fullscreen mode

๐ŸŽ‰ Cleaner async code

๐ŸŽ‰ Works out-of-the-box in modern environments like Vite or Node.js (ESM only)


7. Intl API (for Formatting Dates, Numbers, Currency)

No more moment.js or complex logic to format values:

const price = new Intl.NumberFormat('en-IN', {
  style: 'currency',
  currency: 'INR'
}).format(4999.99);

console.log(price); // โ‚น4,999.99
Enter fullscreen mode Exit fullscreen mode

Also great for:

  • Localized time & dates
  • Plural rules
  • Displaying numbers properly across locales

๐Ÿ‘‰ Explore Intl.NumberFormat on MDN


Quick Tip: Want To Practice These?

Check out this awesome JavaScript Feature Playground on CodeSandbox (includes live examples of each feature above).


Got a favorite underused JS feature that shouldโ€™ve made the list?

Or did one of these just blow your mind a little?

Drop it in the comments ๐Ÿ‘‡ Letโ€™s make this a thread of hidden JavaScript gold for everyone ๐Ÿ’ฌ

๐Ÿ‘‰ Follow DCT Technology for more no-fluff, high-impact dev content.

javascript #webdevelopment #frontend #developer #coding #programming #code #learnjavascript #tech #devto #webdev #es6 #react #nodejs

Top comments (0)