JavaScript Tricks

Photo from jstips

jstips-header-blog

Some time ago, I needed to dive in a JavaScript library which was minified and in the process I found out some ways which are used by the minifiers to reduce a code size. Clearly, the most optimal way is to set 1-2 characters as a variable name. Apart from it, there are some more, which no programmer would do on a clear mind, but just for fun 😀 I offer few of them to guess:
(And then also some nice ones, too)

1. How would you write false with 2 symbols? and true?

!1 false, !0 true

2. How would you reduce this code?

if (a) b();

What about these?

if (!a) b();

if (a) {
b = 1;
c = 2;
}

In JavaScript && and || are short-circuit operators, like in other languages. So, when the result of expression is clear, the rest of the expression, including function invocations, is not evaluated. Instead of if, we can write a&&b().
In the second case, we could have a||b().
The third case is nothing much. Sometimes minifiers just combine everything in one expression and then no blocks are necessary.
if (a) b=1, c=2

3. How would you check something like this with shortest code: If variable is undefined, 0, false, “”, null or NaN – return false, else return true.
(This was not in a minifier, I just often use it).

By converting to bool: result = !!a

4. How would you reduce this part? Let’s say we are validating some arg and if it’s not defined, we set a default value. This one is not from the minifier either.

var options = (arg) ? arg : [];

In case of JavaScript && and || act a bit differently – they don’t return boolean, but a first operand, which determines the expression result. E.g. 1 && 0 && false will return 0.

Consequently, we can write the given expression nicely like this:

var options = arg || [];

4. Minifier does not do this, but, let’s say we need to round number (towards zero). What is the shortest and fastest way to do this?

Let me write the logic. We have a function Math.floor(), but this rounds the number towards negative infinity. So 12.6 will be rounded to 12, but -12.6 will be rounded to -13. This is not the case with our question (Generally, I need rounding towards zero more often than the other).
So we get:

foo > 0 ? Math.floor(foo) : Math.ceil(foo)

If we are not sure that foo is a number and don’t want to recieve NaN, than we’ll need to add another check:

typeof foo === 'number' && !isNaN(foo) && foo !== Infinity
? foo > 0 ? Math.floor(foo) : Math.ceil(foo) : 0;

So the question is, how would you write this with only 2 symbols 🙂 (apart from foo)

We will need some binary operations here. We have two options – double binary division or binary ‘or’ with zero.
~~foo
foo|0

If you’d like to see more details of binary operations, this article has some of them.

5. How would you reduce symbols in numbers with lots of zeros – 1000000, 0.0000023?

1e6, 23e-7 – Counting zeroes is bad 😀

გამოხმაურება

comments

Leave a Reply

Your email address will not be published. Required fields are marked *