7 scariest issues with JavaScript

Published on Dec 22 2017, initially published on bold.io on Oct 24 2017

written by Antoine FERRON

As I'm focused on security and cryptocurrency -which are a melting point between finance and code- I do know that some unexpected bugs in lines of code can lead to serious issues or huge money loss. I sometimes write JS code, as it is very popular and every clients want their web interface. Still, some high-level languages are more complex than others and the issues are sometimes truly... illogical. As more and more of our applications rely on this technology, the future might look scary also.

Quantum-like Test

First of all, I faced this bad-ass issue myself, I dug into my code and finally figured out a single regex test was giving a different result from time to time.
Testing a regex should output the same answer for the same input. JavaScript seems out of this statement. Since with the "global flag", the test is performed on the remaining part of the string. Confusingly, the test function, contrary to replace or match doesn't consume the whole iteration.

var str = "Hello world!";
var pattern = /Hello/g;
console.log(pattern.test(str));
console.log(pattern.test(str));

Basically, the code just over gives the output :
true
falseThis is not strictly a bug, just an ECMAScript feature, but some aspects can be confusing.

Russian Roulette

Inside a loop whatever the number of loops, you expect the same result for a test on a global variable, without any input. This time, you can bet JS VM for Google Chrome (V8) can handle the stunt. When I read some people discussing about this, I can't believed it. So I tested myself during June 2016 in my own Chrome. Here-under my own screenshot. I was shocked!

Thermonuclear Lonewolf

This issue is not strictly code related, but a funny side effect of the JavaScript development world.
Many web developers rely on numerous tiny libraries, for some their usefulness is arguable. No one checks the code in theses libraries. Lot of people download the code from the main public repository at every compilation. That's a bad practice, but this is very common.
A year ago, after a legal injunction from a popular phone app, a developer was so upset that he removed all his code and libraries. Unfortunately, one of his small library - which pads a text - was used by thousands of projects. So that broke the compilation dependencies of many projects which couldn't even produce their app. As we can read on The Register :
"one of those dependencies was left-pad. It pads out the left hand-side of strings with zeroes or spaces. And thousands of projects including Node and Babel relied on it.
With left-pad removed from NPM, these applications and widely used bits of open-source infrastructure were unable to obtain the dependency, and thus fell over during development and deployment. Thousands, worldwide."

Breaking Bad

Compatibility and update are a tricky theme. Using Javascript, you can enjoy some diverging results depending of the ECMAScript used. Here's one of the funniest example.

this.a = 0;
let = [];
let a = 1;
console.log(a, let);

Gives out in ES5 compatible systems.
0, 1
ES6 gives quite the opposite
1, []

I guess this can be used to detect the version running.

Meta Error

With the complexity of JavaScript for the VM, even the error messages can be totally out of their mind. In this example, the error logging system writes out the contrary of what it should.

Error message are a precious help in case of failure. They explain the errors
and point where the issue burst out. With the help of corner cases and complexity they can be sometimes an adversary.

Mixed Nasty Casting for Equality

The comparison tests in JS are complex, mostly because it involves under the hood type-transcasting before the comparison. This leads to some cumbersome results like : 0 == "1" → true
[] === [] → false

Actually, there is some logic behind these behaviors, but a little out of sense which could lead to code development errors. Look at the JS equality table for details.
This leads to weird transitivity equality such as :

'' == '0' → false
0 == '' → true
0 == '0' → true
Some guys even did an online challenge game about that! :)

Lost in Translation

Complex types and many classes functions is sometimes useful, sometimes a pain, and sometimes a road to chaos. Especially in case the code is not clean.

'a',,'c'
Node : 'a', <1 empty item>, 'c' Chrome : "a", undefined×1, "c" Firefox : "a", <1 empty slot>, "c" Safari : "a", 2: "c"

There is still a debate on which browser has the most correct behavior.
Many implementations, many platforms, so many behaviors, gives a lot of work for web developers. Ironically, this is the opposite of the goal of this multi-platform high-level language.
A reminder that when you are written code, be strict or you can face big troubles.

Special Thanks

to /twitter.com/aemkei/