3 min read
By Erik Wendel
December 14, 2018
You've probably seen or heard about this already (it's been quite Twitter-friendly).
Our target string will be
We'll be using our six superhero characters this way: with
 we can create arrays, with the negation and addition operators
+ we can do operations on them and finally use
() to group operations.
Let's start off with a simple array:
Negating an array with
! will coerce the array into a boolean. Arrays are considered to be truthy, so negating it produces
! === false
In the expression
true to a number, resulting in the expression
2 + 1.
In the expression
2 + "2" === "22".
These conversion rules aren't that bad, but it gets quite interesting quite quickly with other types.
Adding arrays together will convert them both to strings and concatenate them.
 +  === "" + "" === ""
The same will happen when adding an array with something else, lets say, a boolean.
! +  === "false" + "" === "false"
Aha! Now we're conjured a string containing the characters we need to produce our end goal, the string
If we only had a number or four, we could extract the characters we need in the right sequence..
"false" === "s" (! + ) === "s"
Let's go looking for numbers!
In the previous section, we coerced an array to a boolean. What happens if we coerce it to a number using
+ === ???
valueOf on the array, which will fail and fall back to a simple
+ === +"" == 0
Coercing a string to a number will produce the following results:
+"42" === 42 +"esg" == NaN +"" === 0
+ === +"" === 0
Aha! Now we have a number, albeit not a very useful one. However, we can keep playing the coercion game:
!0 === true
Negating zero will make the falsy value of zero into a truthy boolean. A truthy boolean as a number becomes... one!
+true === 1
Hooray! One one can become two ones... which is two. You get the point.
Using the substitutions we've learned to create numbers:
1 === +true == +(!0) ==== +(!(+)) === +!+ +!+ +!+ === 2
Let's put together all the things we've learned.
! +  === "false" +!+ === 1 (! + ) + (! + ) + (! + ) + (! + ) ^^^^^^^^^^ ^^^^^^^^^^ ^^^^^^^^^^ ^^^^^^^^^^ "false" "false" "false" "false" ^^^^^^^^^^^^^ ^^^^^^^^^^^^^ ^^^^^^^^^^^^^ ^^^^^^^^^^^^^ s e l f
Our final expression thus becomes:
(! + )[+!++!++!+] + (! + )[+!++!++!++!+] + (! + )[+!++!+] + (! + )[+]
Easy as pie!
Thank you, Brendan Eich ❤️