What does '+!+' mean / do in JS?

[jay1937]

I was working random JS problems, and encountered this problem:

The photocopier is broken… Just as you were sneaking around the office to print off your favourite binary code!

Instead of copying the original, it reverses it: ‘1’ becomes ‘0’ and vice versa.

Given a string of binary, return the version the photocopier gives you as a string.

So basically, you reverse the characters in a binary string, like so: “100010” becomes “011101”
I solved it easily enough, but in looking at the solutions from others, I came across this:

What is happening in ‘+!+char’? Are either of those ‘+’ adding something, or are they both acting as unary operators? I know the ‘!’ is ‘not’, but I’m not understanding the combination of those characters. I did noodle around with it, and could see that if fed a ‘1’, it returns ‘0’ , and vice versa. I guess what I want is a ELI5 for what is happening as the computer looks at those characters.

[JeremyLT]

Have you tried logging out values in the map?

 .map(elem => {
   console.log(elem,+elem,!+elem,+!+elem);
   return +!+elem;
 })

[jay1937]

That is just about exactly what I needed, thank you! I hadn’t thought of deconstructing it in that fashion. I’ve been studying JS for about 6 months now, and every time I think I have a handle on the truthy/falsy concepts, I encounter something like this that just looks like witchcraft

[colinthornton]

@jay1937

looks like witchcraft

Because of this reason, this sort of code should probably only be used when you’re trying to show off about how few characters you can use to solve the problem (code golf).

It would be a lot more understandable (and therefore maintainable) if you wrote it out more explicitly.

[jay1937]

Agreed. In the first few months I was coding, that’s what I thought was good, that shortest meant best. I’ve since talked with a lot of people in the industry who are quick to point out that code golf is NOT the way in the real world!