7 JavaScript Features I Wish I Knew Sooner

"Snippets Sanctuary" 🏛️
, ,
1

7 JavaScript Features I Wish I Knew Sooner

Because reinventing the wheel at 1 AM with spaghetti code is overrated.

Mark Henry

Let me guess…

You’ve stared at your screen, drowning in nested callbacks, wondering if there’s a better way.

You’ve screamed internally (or audibly) trying to center a div and debug a mystery undefined.

You’ve googled “how to clone an object in JavaScript” more times than you’ve opened StackOverflow.

Yeah. Same here.:wink:

When I started my JavaScript journey, I thought I had to manually build everything — loops, conditions, the works — like I was coding in 1999.

No one told me JS had evolved. No one said, “Hey, these built-in features exist, and they’ll save your butt.” So here I am, telling you.

Grab a coffee, or a Red Bull, and let me spare you from my pain.

Here are 7 JavaScript features I wish I knew before I tried to write my own deep clone function.

You can read the full story for free by clicking here

Press enter or click to view image in full size

1280×720 50.4 KB

Img edt:- Mark

1. Optional Chaining (?.)

If you’ve ever written,

if (user && user.profile && user.profile.email)

congratulations, you’re doing too much.

Instead, do this:

const email = user?.profile?.email;

Boom. No error, no tears.

It’s like JavaScript finally grew up and stopped throwing tantrums when things are undefined.

2. Nullish Coalescing (??)

You think || is your friend? Nope. It’s a backstabbing liar when 0, false, or "" enter the chat.

const count = userInput ?? 10;

This only falls back to 10 if userInput is null or undefined.

Unlike ||, it respects falsy values like 0. Because maybe your user did enter 0 on purpose. Don’t be rude.

3. Destructuring

I used to write:

const name = user.name;
const age = user.age;

Like a Neanderthal.

Now?

const { name, age } = user;

Modern problems require modern solutions.

Bonus points for destructuring in function parameters:

function greet({ name }) {
console.log(Hello, ${name});
}

Yes. It’s that clean.

4. Spread and Rest Operators (...)

Three dots. Infinite power.

const newArray = […oldArray, 4];
const newObj = { …oldObj, updated: true };

And in functions:

function sum(…numbers) {
return numbers.reduce((a, b) => a + b, 0);
}

Use it. Abuse it. Just don’t confuse ...rest and ...spread—one gathers, one scatters.

5. Array.map() and friends

Forget for loops. We’re not savages.

const doubled = [1, 2, 3].map(n => n * 2);

Chaining .filter().map().reduce() is the JS version of a flex.

Cleaner, smarter, cooler. Like drinking oat milk lattes with your code editor.

6. Template Literals

Backticks > quotes. Always.

const message = Hello, ${name}. You have ${count} new messages.;

No more messy + signs or broken strings. It’s 2025. We template now.

7. Set and Map

When you’ve had enough of using objects as poor-man’s hashmaps:

const ids = new Set([1, 2, 2, 3]);
console.log(ids); // 1, 2, 3

Want key-value pairs that don’t mess with __proto__? Use Map :

const map = new Map();
map.set(‘key’, ‘value’);

Trust me.

These data structures don’t get enough love, but they’ll change how you write logic forever.

Finally, Don’t Learn the Hard Way (Like I Did)

I spent years reinventing wheels I didn’t know already existed. JavaScript is messy, yes. But it also has a ton of elegant features that — when you know about them — make it feel like a whole new language.

So do yourself a favor: bookmark this, share it with your dev friends, and stop suffering in silence.

Let’s talk.

Which of these did you also discover way too late? Got a feature I missed? Drop it in the comments.

Or scream about it on Twitter. Just don’t gatekeep good JavaScript.