🔥 10 JavaScript Tips with Code Snippets You Should Know

Hey devs! 👋

Whether you're just starting with JavaScript or already knee-deep in frameworks, it's always a good idea to keep your core JS skills sharp.

Here are 10 simple but powerful JavaScript tips, each with an example you can copy-paste and play with right away.
Let’s dive in! 🧠💻

✅ 1. map() vs forEach() — Know When to Use

const numbers = [1, 2, 3, 4];

const mapped = numbers.map(num => num * 2);   // returns new array
const forEachResult = [];

numbers.forEach(num => forEachResult.push(num * 2));

console.log(mapped);        // [2, 4, 6, 8]
console.log(forEachResult); // [2, 4, 6, 8]

🧠 Tip: Use map() when you want to return a new array. Use forEach() when you just want to run side effects (like logging or pushing).

✅ 2. Optional Chaining Saves You from Errors

const user = {
  name: 'John',
  address: {
    city: 'Dhaka'
  }
};

console.log(user?.address?.city);     // 'Dhaka'
console.log(user?.contact?.email);    // undefined (no crash!)

🧠 Tip: Use optional chaining (?.) to safely access deeply nested properties without throwing runtime errors.

✅ 3. Nullish Coalescing vs Logical OR

const count = 0;

const result1 = count || 10;    // 10 ❌
const result2 = count ?? 10;    // 0 ✅

console.log(result1); // 10
console.log(result2); // 0

🧠 Tip: Use ?? when you want to preserve valid falsy values like 0, false, or "".

✅ 4. Clean Object Access with Destructuring

const person = {
  name: "Alice",
  age: 28,
  location: "Chittagong"
};

const { name, age } = person;

console.log(name); // Alice
console.log(age);  // 28

🧠 Tip: Destructuring makes your code more concise and readable, especially when dealing with props or API responses.

✅ 5. setTimeout Inside Loops — Use let, Not var

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1000); // 3 3 3 ❌
}

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1000); // 0 1 2 ✅
}

🧠 Tip: Use let in loops with async logic. var is function-scoped, let is block-scoped.

✅ 6. Convert String to Number Quickly

const str = "42";

console.log(+str);          // 42
console.log(Number(str));   // 42
console.log(parseInt(str)); // 42

🧠 Tip: The unary + operator is a fast and clean way to convert strings to numbers.

✅ 7. Copy Objects Without Side Effects

const original = { name: "Dev", age: 25 };
const copy = { ...original };

copy.name = "Code";

console.log(original.name); // Dev
console.log(copy.name);     // Code

🧠 Tip: Use the spread operator { ...obj } to create shallow copies and avoid unintended mutations.

✅ 8. Filter Arrays Like a Pro

const numbers = [1, 2, 3, 4, 5, 6];

const even = numbers.filter(n => n % 2 === 0);

console.log(even); // [2, 4, 6]

🧠 Tip: .filter() returns a new array containing only the values that match your condition.

✅ 9. Check If an Object Is Empty

const obj = {};

const isEmpty = Object.keys(obj).length === 0;

console.log(isEmpty); // true

🧠 Tip: A simple and effective way to validate API responses, form data, and configs.

✅ 10. Default Parameters in Functions

function greet(name = "Developer") {
  return `Hello, ${name}!`;
}

console.log(greet());        // Hello, Developer!
console.log(greet("Shaun")); // Hello, Shaun!

🧠 Tip: Default parameters help you write cleaner functions without repetitive if checks.

These small, clean, and efficient JavaScript tips can have a big impact on your daily workflow.
They help write bug-free, readable, and maintainable code — whether you're building frontend UIs or backend services.

Got a favorite JS tip?
Let me know in the comments or share this with your fellow devs! 🚀