iFTekhar

Posted on Mar 19, 2021 • Edited on Mar 20, 2021

Awesome 5 javascript Shorthands

#javascript #codenewbie #tutorial #codequality

In this blog, I have shared 5 awesome shorthand tricks to make a developer's life faster!

1) Setting the variables values

Normally you would define a variable then say x = value and if you have lots of variables (obviously) then it could take more time.

So you can simply define variables inside a set of square brackets then put the values on another set of square brackets like this.

2) Using Double Bitwise NOT operator instead of `Math.floor()`

Well you might have surely used Math.floor() to get rid of the decimal points but there is an easier way of doing the same operation using the Double Bitwise NOT operator it performs the same operation much faster.

3) For loop short hand

Instead of using a for-loop like the way we usually use you can just simply do this.

4) The logical AND operator

Suppose you want to call a function if one condition or statement is true or false. you would say if(something) then call function but instead of doing that there is a really better way of doing it which is to say something && callFunction() which means if the something is true then that function is going to be called.

5) Turning array into object

You might do a lot of things in order to just turn an array into an object. but the simplest way I think is to use the so-called spread operator or the ... operator

That was it! Thank you for reading my blog hope this makes your developing life fast and let me know if you like this little blog of mine. Thank you so much for reading this!🙂

Top comments (15)

Jon Randy 🎖️ • Mar 20 '21 • Edited

Beware when using the double NOT - it isn't the same as Math.floor:

Math.floor(2.3) // 2
~~2.3 // 2

Math.floor(-2.3) // 3
~~-2.3 // 2

iFTekhar • Mar 20 '21

Thanks for pointing. agree.🙂

Khorne07 • Mar 21 '21 • Edited

I see people often complaining about that these kind of shorthands decrease code readability but wtf, I love write compact code like this and also love to read it like this. If someone complain about it is because he/she is not adapted to use the beneficts of write compact code using the new Ecma features. Maybe all the community need is more post like these showing how easy is to get those tips, so 👍 good post 🙂

iFTekhar • Mar 21 '21

Thank you so much glad you liked it. enjoy🔥

machtyn • Mar 20 '21

If shorthand isn't understandable to the next dev that follows you, it probably ought not to be done. For example, #2 using -- as Math.floor. Besides, it fails in some cases, so it may cause future problems. #4 is iffy on the readability, but I do like it.

iFTekhar • Mar 20 '21

That's why you should read the doc carefully before using anything that prevents breaking. Glad you liked it Thank you for reading.😊

Jen • Mar 21 '21

ES2020 and 2021 have brought some more awesome "shortcuts", namely optional chaining which allows you to shorten

let temp = obj.first;
let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.second);

let nestedProp = obj.first?.second;

another neat one from 2021 (currently available through babel plugin) is logical assignments, ||=, &&=, ??=.
in the case of &&= you can shorten

let a;
let b;
if(!!b) {
  a = b;
}
// shortens to
a &&= b

machtyn • Mar 20 '21 • Edited

Also, instead of let fruits of fruits it should be let fruit of fruits since in that for loop, you're working with just one of the fruits (or items) in the list at the time.

iFTekhar • Mar 20 '21

Oh, Thank you so much I really missed that. Thank you for your point I'm changing it immediately.

Thomas Broyer • Mar 20 '21

You seem to forget that code is an order of magnitude read more than it is written. Optimize for readability and leave those things for optimizing tools and bundlers.