DEV Community

Cover image for 5 Common JavaScript Mistakes and How to Avoid Them
Mark Rober
Mark Rober

Posted on

5 Common JavaScript Mistakes and How to Avoid Them

JavaScript is a powerful and popular programming language used to build websites, apps, games, and much more. But even experienced developers can make simple mistakes while writing JavaScript code. These mistakes may seem small, but they can cause bugs, break the website, or make your code harder to maintain. Whether you're a beginner or brushing up your skills, these tips will help you write cleaner, more reliable code. Check it out.

  1. Not Declaring Variables Properly

The Mistake:
Many developers forget to use let, const, or var when declaring variables. This leads to what's called "implicit global variables." It happens when a variable is created without a proper declaration.
name = "John"; // Bad: No let/const/var

This code works, but it creates a global variable, which can cause conflicts or unexpected behaviors in bigger projects.

How to Avoid:
Always use let or const to declare your variables.
Use const when the value doesn’t change.
Use let when you need to reassign a value.

const name = "John"; // Good
let age = 25;

  1. Using == Instead of === The Mistake: JavaScript has two types of equality operators: == (loose equality) and === (strict equality). The loose version tries to convert data types before comparing, which can lead to confusing results. console.log(0 == '0'); // true console.log(false == ''); // true

How to Avoid:
Use === to compare values. It checks both value and type, which is much safer.
console.log(0 === '0'); // false
console.log(false === ''); // false

  1. Not Understanding Asynchronous Code The Mistake: JavaScript is single-threaded but handles asynchronous tasks (like API calls, timers, etc.) using callbacks, promises, and async/await. A common mistake is expecting code to run in order, when in reality, asynchronous code runs later. console.log("Start"); setTimeout(() => console.log("Waited 1 second"), 1000); console.log("End");

You might expect "Waited 1 second" to print before "End", but it doesn’t.

How to Avoid:
Use async/await when working with asynchronous operations for better readability and control.
async function fetchData() {
console.log("Start");
await new Promise(resolve => setTimeout(resolve, 1000));
console.log("Waited 1 second");
console.log("End");
}

fetchData();

  1. Modifying the Original Array/Object by Mistake The Mistake: JavaScript arrays and objects are reference types. So when you assign or pass them, you might end up changing the original one without meaning to. let original = [1, 2, 3]; let copy = original; copy.push(4); console.log(original); // [1, 2, 3, 4]

How to Avoid:
Use spread syntax (...) or methods like .slice() to create a true copy.
let original = [1, 2, 3];
let copy = [...original];
copy.push(4);
console.log(original); // [1, 2, 3]

For objects:
javascript
CopyEdit
let user = { name: "Alice" };
let newUser = { ...user };
newUser.name = "Bob";
console.log(user.name); // "Alice"

  1. Misusing this Keyword The Mistake: In JavaScript, this behaves differently depending on how and where you use it. In functions, it may not always point to what you expect. const user = { name: "ABC", greet: function () { setTimeout(function () { console.log("Hello, " + this.name); // undefined }, 1000); } };

user.greet();

How to Avoid:
Use an arrow function to keep the context of this. Arrow functions don’t have their own this; they use the one from the surrounding scope.
const user = {
name: "ABC",
greet: function () {
setTimeout(() => {
console.log("Hello, " + this.name); // Hello, ABC
}, 1000);
}
};

user.greet();

Final Thoughts
JavaScript is fun, flexible, and everywhere – but it's also full of quirks. As a developer, it's important to be aware of these common pitfalls. By avoiding these 5 mistakes:
Always declare your variables.
Use === for comparisons.
Handle async code properly.
Be careful with array/object references.
Understand how this works.

You'll write cleaner, more reliable code that works the way you expect. And remember – everyone makes mistakes. The key is learning from them and improving every day.

Top comments (0)