Some Common JavaScript mistakes

JavaScript is among the most popular languages for web development today. It’s fairly easy to start, and boasts of some powerful features. But mastering it requires time and lot of practice.

While beginners are prone to make some classic mistakes, developers with programming experience aren’t completely immune to errors. Anyone can make mistakes by perhaps overlooking the nuances of JavaScript. This could lead to unexpected results in your code. Below are actually some mistakes but avoiding them will make us a better programmer for sure.

Equality Check

Lets look at the code directly to understand it better.

if (false == 0) {
    return true;
}else {
    return false;
}


if (false === 0) {
    return true;
}else {
    return false;
}

Both should return true ?? Sorry to disappoint you but first if condition will return true and second will return false. **Thinking what kind of sorcery is that**. The difference in both is just a ‘=’, which makes a huge difference. “==” checks for equality with coercion and “===” checks for equality without coercion.

Ignoring ‘var’ and Scopes

Beginners, when starting out, tend to forget about using var in declarations, and JavaScript doesn’t complain either. Instead, it assumes the variable has a global scope. This can be detrimental to your codebase and lead to bugs. The following example illustrates one such discrepancy:

var a = 1;

function simple() {
a = 5;
}

simple()console.log(a); //5

Also, avoiding var could lead to reference errors, like the one shown below:

console.log(x); //ReferenceError
x = 1;

console.log(x); //undefined

var x = 1;

Unlike most programming languages, JavaScript doesn’t provide a block-level scope for var. For example, in the following code, the value of i would exist beyond the loop:

for (var i = 0; i < 5; i++) {
  /* ... */
}

console.log(i);  // 5

To ensure the value i stays within that block, we need to use let instead. The difference: var is function scoped, whereas let ensures a block scope.

 Addition and Concatenation

Addition and concatenation will depend on the data types as we don’t explicitly define variables with datatypes in javascript.

var a = 10;
var b = '20';
var c = 30;

return a + b; // returns 1020
return b + c; // returns 2030
return a + c; // returns 40

So we can see in the above example, if we try to add a string and integer it will return a concatenated string but in case of two integers it returns sum of both.

Using variable as key in object

There can be certain cases where we are required to use variables as key. lets take an example.

const a = 1;
let b = '';

if(a) {

  b = 'first Name';

}else {

  b = 'Last Name';
}

const myObject = {

  b : 'Emily'

};

return myObject;

Here in the above code we wanted to return object as { ‘first Name’ : ‘Emily’ } but what it returns is { b: ‘Emily’ } since b is used as key. So to solve the above problem we use square brackets [].

if(a) {

  b = 'first Name';

} else {

  b = 'Last Name';
}

const myObject = {

  [b] : 'Emily'
};

return myObject;

Now it returns what we wanted it to return { ‘first Name’ : ‘Emily’ }.