5 quick JavaScript hacks

1.   Bool condition check

This is one of the basic oversights that each software engineer would have done at least once in their coding professions. Let’s take a look at the code below.

let x = 0;

 let y = 0;

if (x === 0) {

  y = 1;

 } else {

  y = 2;

 }

The above code looks right, right? Also, it is, however there is something more we can do with it. Now take a look at the code.

let x = 0;

let y = 0;

if (!x) {

  y = 1;

} else {

  y = 2;

}

Does this look any better? So for the reality, we don't have to expressly check for 0 here as it’s a falsy esteem. We can just check, if not x then go inside the condition.

2.   Ternary Condition

Each developer has utilized if condition at any rate once in their lifetime yet at places where there isn't much logic inside the condition we can just supplant it with ternary operators. Why? To spare a couple of lines ;). Let’s take a similar case from above and actualize it utilizing ternary operator.

let x = 0;

let y = 0;

y = !x ? 1 : 2;

So here in the above code rather than 5 lines of code we have basically actualized a similar logic in a single line. Let’s investigate another bit of code.

if (whatever condition) {

  ----------------

  some logic here

  ----------------

  return x ? true : false;

}

There is nothing incorrect in the above code yet you could basically maintain a distance from the ternary operator here. how? take a look at the code beneath.

if (whatever condition) {

  ----------------

  some logic here

  ----------------

  return x; // if you are sure x is boolean

  return !!x; // if x can be anything other than boolean

}

So from above we can see that we don't generally require ternary operators and make an effort not to ever utilize nested ternary operators.

3.   Equal check

Let’s take a look at the code specifically to comprehend it better.

if (false == 0) {

  return true;

} else {

  return false;

}

if (false === 0) {

  return true;

} else {

  return false;

}

Both are returning true, right?? Mmm not right :p, 1st condition will return true and second will return false. The identity (===) operator behaves identically to the equality (==) operator except no type conversion is done, and the types must be the same to be considered equal.

4.   Add and concatenate

Addition and concatenation will rely upon the data types as we don't explicitly characterize 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 find in the above case, on the off chance that we attempt to add a string and an integer it will restore a concatenated string however in the case of two integers it returns sum of both.

5.   Variable as a key

const a = 1;

let b = '';

if(a) {

  b = 'first Name';

 } else {

  b = 'Last Name';

}

const someObject = {

  b : 'Anser'

};

return someObject;

Here in the above code, we needed to return object as { 'first Name' : 'Anser' } yet what it returns is { b: 'Anser' } since b is utilized as key. So to take care of the above issue we utilize square brackets []. See the code below:

if(a) {

  b = 'first Name';

} else {

  b = 'Last Name';

}

const someObject = {

  [b] : 'Anser'

};

return someObject;

Now it returns what we needed it to return { 'first Name' : 'Anser' }.

Hopefully you have learnt something from this article. Comments and feedback always make the writer happy ;)